9

ログインに使用する Bootstrap ドロップダウン メニューがあります。問題ないように見えますが、ユーザー名の入力を選択すると、フォーカスが入力に移動したため消えます。入力のサポートを追加するにはどうすればよいですか、またはこれに有効な方法はありますか?

私の現在のコードは次のとおりです。

    <li id="fat-menu" class="dropdown">
         <a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown" data-target="#">Login <b class="caret"></b></a>
         <ul class="dropdown-menu" role="menu" aria-labelledby="drop3">
            <li role="presentation"><input name="username" type="text" placeholder="Username" /></li>
            <li role="presentation"><input name="password" type="password" placeholder="Password" /></li>
            <li role="presentation" class="divider"></li>
            <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Login</a></li>
          </ul>
     </li>

私のjsfiddleでの試み。ドロップダウンをまったく機能させることができませんでした: http://jsfiddle.net/KF8dv/

4

1 に答える 1

16

これを見てください:- http://jsfiddle.net/b8769/

入力テキストボックスをクリックしたときのドロップダウンイベントを防ぐ必要があります。これは、javascript を使用して実現できます。伝搬停止

$('.dropdown-menu input').click(function(e) {
        e.stopPropagation(); //This will prevent the event from bubbling up and close the dropdown when you type/click on text boxes.
    });
于 2013-04-17T03:15:42.497 に答える