当我们在平板电脑上点击外面时，如何关闭bootstrap 3下拉列表？

我这样做，它在桌面上工作正常：

$(document).on("click", function(){ $(".dropdown-toggle").removeClass("open"); }); 

但在iPad上，它无法正常工作，我的下拉列表仍然打开

Answer 1

您应该使用touchstart和touchend事件与触摸设备：

 $(document).on("click touchend", function(){ $(".dropdown-toggle").removeClass("open"); }); 

Answer 2

这个答案与导航栏菜单有关，而不是一般的下拉菜单 ，但我在寻找自己类似问题的答案时遇到了这个问题（在外面敲击时关闭汉堡包菜单），所以我想我会为其他人发布替代解决方案，如同接受的答案不适用于汉堡包子菜单 （点击打开子菜单会关闭汉堡包菜单）。

这个答案是基于已接受的答案和答案，以及NickGreen对此答案的评论。

 $('html').on('click, touchend', function (e) { // Close hamburger menu when tapping outside if ($(e.target).closest('.navbar').length == 0) { var opened = $('.navbar-collapse').hasClass('collapse in'); if (opened === true) { $('.navbar-collapse').collapse('hide'); } } }); 

Answer 3

如果我不想在用户点击页面时关闭页面上的任何下拉列表，我会使用此代码段。

 $(document).on('click touchend', function(e) { if ($(e.target).closest('.open').length === 0) { $('.dropdown-toggle').parent().removeClass('open'); } });