防止点击后下拉菜单

Question

我将下拉菜单的功能更改为悬停而不是单击，我使用以下脚本来实现。

queueInput()

它工作正常，但是，如果我单击下拉列表并删除鼠标，则该下拉列表保持打开状态，因为触发了对其的单击。因此，我尝试使用stopPropagation，但仍然可以单击下拉菜单。

$(document).on({
    mouseenter: function () {
        $(this).find('.dropdown-menu').addClass('d-block');
    },
    mouseleave: function () {
        $(this).find('.dropdown-menu').removeClass('d-block');
    }
}, ".dropdown");

您可以尝试使用以下HTML进行播放：

$(document).on('click', '.dropdown-toggle', function(e) {
    e.stopPropagation();
});

我想要的实际结果是删除下拉菜单中单击的功能，然后完全更改为仅悬停。

Answer 1

查看了有关Bootstraps下拉菜单工作方式的更多详细信息之后，我发现删除data-toggle="dropdown"属性可防止按钮触发下拉菜单。

通过这种方式，现在只有鼠​​标事件才应该控制下拉菜单的显示，而单击下拉菜单将不会触发它。