focus() not working in safari or chrome

set the tabIndex of 'toInput' to 0 or higher, its a known Chrome bug:

http://code.google.com/p/chromium/issues/detail?id=467043


I got the answer on my own, it might seem weak, and too simple, but it works.

Ready for this awesomeness..?

Just add a timer of 0 to the focus...for some reason it just gives it enough time to fully load the input into the DOM.

function recipientDivHandler(code, element) {
  $("#recipientsDiv").append('<input type="text" id="toInput" class="inlineBlockElement rightSpacer" style="border:0px none #ffffff; padding:0px; width:40px;margin-bottom:3px;padding:0; overflow:hidden; font-size:11px;" />');
  setTimeout(function() {
    $("#toInput").focus();
  }, 0);
}

If someone else can further explain this or has a better answer please feel free to take the stage :-)


Although I couldn't find this specifically stated anywhere, .focus() only works on input elements and links. It also isn't supported properly in Chrome and Safari. I posted a demo here to show you what I mean. Also note that focus() and focusin() (v1.4) have the same results.

So that being determined, try changing your function to .click()

$("#recipientsDiv").click(function(e){ ... })