我有一个我计划用来登录的Bootstrap下拉菜单.它似乎很好,但是当我选择用户名nput时它会消失,因为焦点已经转移到输入.我将如何添加对输入的支持,或者是否有一种工作方法?
我目前的代码是:
<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/
解决方法
请看这个: –
http://jsfiddle.net/b8769/
http://jsfiddle.net/b8769/
单击输入文本框时,需要防止下拉事件.你可以使用javascript来解决这个问题. stopPropagation
$('.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. });