элемент ввода focus() с jQuery, но курсор не отображается

Я хочу сфокусировать элемент ввода при нажатии div.

мой HTML выглядит так:

<div class="placeholder_input">
    <input type="text" id="username" maxlength="100" />
    <div class="placeholder_container">
        <div class="placeholder">username</div>
    </div>
</div>

и мой скрипт:

$("#username").focus(function() {
    $(this).next().hide();
});

$(".placeholder_input").mousedown(function() {              
    $(this).children(":first").focus();
});

когда я нажимаю на текстовое поле, текст заполнителя исчезает правильно, но мигающий курсор не отображается в текстовом поле. (и я не могу ввести текст в текстовое поле)

внутри mousedown обработчик события $(this).children(":first") выражение выбирает правильный элемент ввода, поэтому я понятия не имею, почему focus() звонок не работает.

3 ответов


не работает с mousedown метод; он, однако, работает с mouseup() и click() методы:

$(".placeholder_input").mouseup(function() {              
    $(this).children(":first").focus();
});​

JS Fiddle demo.

и:

$(".placeholder_input").click(function() {              
    $(this).children(":first").focus();
});​

JS Fiddle demo.

ссылки:


Если вы настаиваете на использовании mousedown, отложите фокус до следующего тика

$(".placeholder_input").mousedown(function() {              
      var $el =  $(this).children(":first");
      setTimeout(function() {
          $el.focus();
      }, 0);
});

http://jsfiddle.net/wpnNY/46/


mousdown не будет работать, используйте click.

$(".placeholder_input").click(function() {              
    $(this).children(":first").focus();
});​