gpt4 book ai didi

jQuery 自动完成功能停用 Bootstrap 菜单下拉菜单

转载 作者:行者123 更新时间:2023-12-01 04:55:29 35 4
gpt4 key购买 nike

我使用 twitter bootstrap 作为我的网站框架。我也在使用 jQuery。

在我的主导航栏中,我有一个包含搜索框的 Bootstrap 下拉列表。搜索框有一个 jQuery 自动完成功能,可以完美运行。

但是,我的问题是,当用户单击自动完成列表中的一项时, Bootstrap 下拉列表将关闭,阻止用户单击“搜索”按钮,直到重新打开下拉列表(搜索查询仍然存在) .

显然这让我的用户很恼火......

当从自动完成列表中进行选择时,是否有一种简单的方法可以防止下拉列表关闭?这是由于两个框架之间的冲突吗?

Auto Complete

提前致谢。

戈登

更新:

使用以下代码解决了这个问题:

    <script type="text/javascript">
$(document).ready(function () {
$('body').find('.ui-autocomplete').click(function (e) {
e.stopPropagation();
});
});
</script>

这会在单击时停止 ui-autocomplete 下拉元素上的传播,并保持 Bootstrap 下拉列表打开以允许用户单击搜索按钮。

感谢伊舍伍德的指点

最佳答案

这不是冲突,而是 Bootstrap 菜单的正常行为。我为此目的使用这些函数:

$(function() {
//prevent menu from closing when clicking into a form element
$('.drop').find('form').click(function (e) {
e.stopPropagation();
});

// other elements with the 'stay-open' class
$('.drop').find('.stay-open').click(function (e) {
e.stopPropagation();
});
});

关于jQuery 自动完成功能停用 Bootstrap 菜单下拉菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14585542/

35 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com