为什么iOS上没有Bootstrap按钮下拉列表?

Rom*_*man 15 html javascript css twitter-bootstrap

看起来甚至这里bootstrap演示也无法在iOS上运行.您似乎无法在iPhone或iPad上从中选择项目.

有没有解决这个问题?

jko*_*n.e 9

github上的许多问题评论都提到了一个快速修复:https: //github.com/twitter/bootstrap/issues/2975#issuecomment-8670606

在close html标记之前添加此脚本:

$('body').on('touchstart.dropdown', '.dropdown-menu', function (e) { 
    e.stopPropagation(); 
});
Run Code Online (Sandbox Code Playgroud)

我已经在ios5和6上测试了上述方法.它就像一个魅力


如果你想修改bootstrap javascript,你可以,而不是上面的修复,从文件底部附近的clearMenus的html绑定中删除touchstart.dropdown.data-api.

只是改变这个

$('html')
  .on('click.dropdown.data-api touchstart.dropdown.data-api', clearMenus)
Run Code Online (Sandbox Code Playgroud)

对此

$('html')
  .on('click.dropdown.data-api', clearMenus)
Run Code Online (Sandbox Code Playgroud)

  • 我仍然在iOS 7中遇到这个问题.我正在使用Bootstrap 3.3.4和jQuery 1.11.3.任何想法如何解决它? (2认同)

sup*_*yan 0

您需要在文件中添加自定义 jquery。如果您想使用它,请使用:

<div class="container">
  <div class="btn-group lt category_bg">
    <p>Adults</p>
    <button class="btn btn-large" data-toggle="dropdown"><cite>0</cite> <span class="caret"></span></button>
    <ul class="dropdown-menu ">
      <li id='adult_0' onClick="flight_user(this.id)"><a href="#" >0</a></li>
      <li id='adult_1' onClick="flight_user(this.id)"><a href="#" >1</a></li>
      <li id='adult_2' onClick="flight_user(this.id)"><a href="#" >2</a> </li>
      <li id='adult_3' onClick="flight_user(this.id)"><a href="#">3</a></li>
      <li id='adult_4' onClick="flight_user(this.id)"><a href="#">4</a></li>
    </ul>
  </div>

</div>
<script src="js/jquery.js"></script>
<script src="js/bootstrap-dropdown.js"></script>


 <script>
    function flight_user(selected){
    var value = jQuery("#" + selected).find('a').text();
    jQuery("#" + selected).parent().parent().find('cite').html(value);
    }

</script>
Run Code Online (Sandbox Code Playgroud)

如果您愿意,我可以为您提供现场演示