web-dev-qa-db-ja.com

focus（）入力要素とjQueryがあるが、カーソルが表示されない

Divがクリックされたときにinput要素をフォーカスしたい。

私の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()呼び出しが機能しない理由がわかりません。

javascriptjqueryhtmlfocuscursor
15
Zsolt

mousedownメソッドでは機能しません。ただし、 mouseup() および click() メソッドで機能します。

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

JS Fiddleデモ 。

そして：

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

JS Fiddleデモ 。

参照：

13
David Thomas

mousedownの使用を主張する場合は、次のティックまでフォーカスを遅らせます

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

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

5
bentael

mousdownは機能しません。clickを使用してください。

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