gpt4 book ai didi

javascript - Bootstrap 弹出框 : hide when cursor moves outside of the window

转载 作者:行者123 更新时间:2023-11-28 19:34:19 28 4
gpt4 key购买 nike

当用户将鼠标悬停在文本链接上时,我想显示一个包含多个按钮的弹出窗口

我遇到的问题是,当触发它的链接中的光标(例如,当用户移动以选择其中一个按钮时)时,我当前使用的默认 Bootstrap 弹出窗口将被关闭

<小时/>

这个jsFiddle是我尝试做的一个例子。原则是:当链接(#example)悬停时显示弹出窗口,当弹出窗口(.popover)时隐藏弹出窗口未悬停。

但这不起作用,尽管我确信 BS popover 封装在 .popover 类中(我使用 FF 开发调试工具进行检查)。

有趣的事情:它可以与另一个 div 一起使用!如果我更换

$('.popover').mouseleave(function(){
$('#example').popover('hide');
});

按此

$('.square').mouseleave(function(){
$('#example').popover('hide');
});

当不再悬停在蓝色方 block 上时,弹出窗口确实隐藏了。

为什么不能使用.popover

最佳答案

当鼠标离开 .popover-content 而不是 .popover 时,您需要隐藏 popover。而.popover-content一开始并不存在,所以需要将事件绑定(bind)到document

    $(document).on('mouseleave','.popover-content',function(){
$('#example').popover('hide');
});

http://jsfiddle.net/o4o9rrsq/2/

关于javascript - Bootstrap 弹出框 : hide when cursor moves outside of the window,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26211104/

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