html - 单击选择标签选项。引导弹出窗口关闭

Question

我不懂英语。很抱歉交换无意义的短语。

单击选择标签选项。引导弹出窗口关闭。

提琴手

注意：问题 Mozilla firefox 浏览器。

// Bootstrap Popover
$('body').popover({
    selector: '[data-popover]',
    html: true,
    trigger: 'click hover',
    title: function() {
        return $('.select_box').html();
    },
    content: '...',
    placement: 'bottom',
    delay: {
        show: 50,
        hide: 400
    }
});

<button class='btn btn-primary' data-popover="true">hover here</button>


<div class="select_box hidden">
    <select class="form-control">
        <option>Day</option>
        <option>Week</option>
        <option>Month</option>
        <option>...</option>
    </select>
</div>

Answer 1

select元素在浏览器中的行为不一致，并且可以在不同的时刻触发相关事件。

维护 jQuery 的一种方式可以检查触发鼠标离开的当前目标是否是选择，如果是，则重新绑定mouseleave处理程序。

代码：

if (obj.currentTarget) {
    container = $(obj.currentTarget).siblings('.popover')
    timeout = self.timeout;
    container.one('mouseenter', function () {
        //We entered the actual popover – call off the dogs
        clearTimeout(timeout);

        var bindLeave = function () {
            container.one('mouseleave', function (e) {
                if ($(e.target).is('select')) {
                    bindLeave();
                    return;
                }
                $.fn.popover.Constructor.prototype.leave.call(self, self);
            });
        }

        bindLeave();
    })
}

演示：http: //jsfiddle.net/IrvinDominin/tskf0eoL/