使用“data-poload”单击其他位置时隐藏引导弹出窗口

时间:2014-02-21 03:28:51

标签: jquery twitter-bootstrap popover

每当用户点击不同的按钮或页面上的任何其他位置时,我都会尝试隐藏引导弹出窗口。我在这个网站上搜索了很多,但都没有。我认为这主要是因为我在一个页面中只有少数<a data-poload='example.com' rel=popover style='text-align:right; float:right;'>Details</a>作为我的弹出链接。请帮助谢谢!

实施例

<a data-poload='example.com' rel=popover style='text-align:right; float:right;'>Details</a> 
<a data-poload='example2.com' rel=popover style='text-align:right; float:right;'>Second Details</a> 
<a data-poload='example3.com' rel=popover style='text-align:right; float:right;'>Third Details</a>

table.$('*[data-poload]').bind('click', function () {
        var e = $(this);
        e.unbind('click');
        $.get(e.data('poload'), function (d) {
            e.popover({
                content: d,
                container: 'body',
                html: true,
                //trigger: 'manual',
                placement: function (tip, element) {
                    var offset = $(element).offset();
                    height = $(document).outerHeight();
                    width = $(document).outerWidth();
                    vert = 0.5 * height - offset.top;
                    vertPlacement = vert > 0 ? 'bottom' : 'top';
                    horiz = 0.5 * width - offset.left;
                    horizPlacement = horiz > 0 ? 'bottom' : 'bottom';
                    placement = Math.abs(horiz) > Math.abs(vert) ? horizPlacement : vertPlacement;
                    return placement;
                }
            }).popover('show');
        });
    });

我的jsfiddle:http://jsfiddle.net/59Dpk/3/

0 个答案:

没有答案