2

我正在使用最新的 Bootstrap 3，并且我有一个名为“登录”的按钮，单击该按钮会显示一个登录下拉列表。到目前为止，一切都很好。一切正常。唯一的问题是，单击表单字段后，整个表单会消失......由于按钮下拉菜单关闭。我四处阅读，这是由于 'e.StopPropagation' javascript 造成的，但我相信正确地在 HTML 页面的末尾添加了该部分，但它仍然关闭。任何想法我做错了什么？

这是代码：

 <div class="btn-group">
   <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
     Login <span class="caret"></span>
   </button>
   <ul class="dropdown-menu pull-right toprightlogin" role="menu">
     <li>

        <form class="form-horizontal" role="form">
   <div class="form-group">
     <label for="inputEmail1" class="col-lg-2 control-label">Email</label>
     <div class="col-lg-10">
       <input type="email" class="form-control" id="inputEmail1" placeholder="Email">
     </div>
   </div>
   <div class="form-group">
     <label for="inputPassword1" class="col-lg-2 control-label">Password</label>
     <div class="col-lg-10">
       <input type="password" class="form-control" id="inputPassword1" placeholder="Password">
     </div>
   </div>
   <div class="form-group">
     <div class="col-lg-offset-2 col-lg-10">
       <button type="submit" class="btn btn-default">Sign in</button>
     </div>
   </div>
 </form>



        </li>
   </ul>
 </div>

和javascript：

        <script>
     $(function() {
   // Setup drop down menu
   $('.dropdown-toggle').dropdown();

   // Fix input element click problem
   $('.dropdown input, .dropdown label').click(function(e) {
     e.stopPropagation();
   });
 });
        </script>
4

2 回答 2

1

改为这样做

$(function() {
    // Fix input element click problem
    $('.btn-group input').click(function(e) {
        e.stopPropagation();
    });
});

除了不同的选择器，$('.dropdown-toggle').dropdown()不是必需的。

于 2013-08-23T13:40:03.267 回答
0

到目前为止，我没有使用 Bootstrap 组件，但是如果将e.stopPropagation()替换为 e.preventDefault( )会发生什么。

于 2013-08-23T13:15:58.070 回答