我有一个bootstrap下拉菜单。 我希望它在我点击它时保持打开状态 ，但在单击下拉切换按钮或菜单外部时关闭。
当我在input时，下拉列表似乎没有关闭，但当我点击下拉列表中的任何其他位置时，它会关闭。
问：如何通过使用jQuery来避免这种情况？
以下是我的HTML ：
Bootply中的演示
您可以使用以下JavaScript手动打开和关闭下拉菜单：
$(function() { $('.dropdown-toggle').on('click', function(event) { $('.dropdown-menu').slideToggle(); event.stopPropagation(); }); $('.dropdown-menu').on('click', function(event) { event.stopPropagation(); }); $(window).on('click', function() { $('.dropdown-menu').slideUp(); }); });
StackSnippets中的演示
$(function() { $('.dropdown-toggle').on('click', function(event) { $('.dropdown-menu').slideToggle(); event.stopPropagation(); }); $('.dropdown-menu').on('click', function(event) { event.stopPropagation(); }); $(window).on('click', function() { $('.dropdown-menu').slideUp(); }); });
从单击里面的关闭避免下拉菜单的问题，你可以简单地从下拉列表中停止传播，如下所示：
$(document).on('click', '.allow-focus .dropdown-menu', function (e) { e.stopPropagation(); });
Stack Snipets中的演示
$(document).on('click', '.allow-focus .dropdown-menu', function (e) { e.stopPropagation(); });
以上就是jQuery教程分享单击里面时保持Bootstrap下拉打开相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。
本文来自网络收集，不代表计算机技术网立场，如涉及侵权请联系管理员删除。
ctvol管理联系方式QQ:251552304
本文章地址：https://www.ctvol.com/jquerytutorial/561838.html