3

从下面的问题/答案中，我了解到当您在 JavaScript 中调用 .popover("show") 时，隐藏选项不起作用。

Twitter Bootstrap Popup 忽略延迟

但是当鼠标点击触发弹出框时它不应该工作吗？

在下面的 jsFiddle 中，您可以单击文本并显示弹出框。但延迟后它并没有隐藏。

$("#clickMe").popover({
    content: "Hello world",
    delay: { show : 100 , hide : 1000 }
});

.

   <span id="clickMe">Click me</span>

http://jsfiddle.net/ahmed002/cwpB9/

是否预计延迟在这种情况下不起作用（如果是，在这种情况下该选项是否起作用）？

4

2 回答 2

0

Bootstrap 的隐藏选项不是自动隐藏延迟 -> 不幸的是，用户必须单击才能隐藏弹出框。之后单击引导程序的隐藏选项将延迟隐藏。

如果您希望弹出框自动隐藏，请使用以下代码。它定义了一个新的 jQuery 函数，该函数放置一个带有自动隐藏的引导弹出框。

/****** Defines new jQuery functions */
jQuery.fn.extend({
    popoverWithAutoHide: function (popoverText) {
        $(this).popover({
            content : popoverText
        }).on('shown.bs.popover', function () {
            var $this = $(this); // CLosure
            setTimeout(function() {
                 $this.popover("hide");
            }, 3000);
        });
    }
});

基本上，一旦显示弹出框，它就会激活附加功能。该函数调用 jQuery setTimeout 以在 3000 毫秒后调用第三个函数。第三个函数关闭了弹出框。

用法很简单：

$("#editButton").popoverWithAutoHide("To edit items, you need to be logged in and have a rank 5 or higher.");
于 2013-10-29T13:43:23.787 回答
0

请耐心等待 :) 延迟时间以毫秒为单位，也适用于您的小提琴。使用更长的时间，单击一次并等待（10 秒）然后再次单击并再次等待 10 秒：

$("#clickMe").popover({
            content: "Hello world",
            delay: { show : 10000 , hide : 10000}
      });

如果您将触发器设置为手动，则延迟设置将不起作用（请参阅：如何在 Twitter Bootstrap 框架中使用“手动”作为弹出框的触发选项？）

于 2013-10-16T18:38:28.420 回答