Question

我在页面上有一个元素如下：

<a data-ajaxload="/League/PointBreakdown/228583" href="#228583" class="point-breakdown" data-original-title="" title="">-</a>

我正在调用下面的popover，返回的内容是HTML，从服务器获取少量HTML后一切正常。页面上有很多这样的链接，但我遇到的问题是我无法点击两次相同的链接。我可以看到弹出窗口立即闪烁并关闭。我一次只想在页面上找一个，即当另一个打开时删除一个。

$('*[data-ajaxload]').bind('click', function () {


        if ($(this).parent().children('.popover').length > 0) {
            return;
        }

        ShowSpinner($(this).parents('table'));

        try {
            $('.popover').remove();

            var e = $(this);

            $.get(e.data('ajaxload'), function (d) {

                e.popover({ content: d, html: true }).popover('show');

                HideSpinner();
            });

        }
        catch (ex) {

            HideSpinner();
            $('.popover').remove();
        }
    });
// pass in element to move the mask
function ShowSpinner(elem) {

    if (typeof (elem) != 'undefined' || elem != 'undefined') {

        // move the mask
        $('#mask').appendTo($(elem));
    }

    $('#mask').show();

}
function HideSpinner() {

    $('#mask').appendTo($('body'));
    $('#mask').hide();

}

Answer 1

我只需将代码更改为以下内容：

$('*[data-ajaxload]').on('mouseenter', function () {
        $('.popover').remove();

        var link = $(this).attr('data-ajaxload');
        var content = "";
        $.ajax({
            cache: true,
            type: 'post',
            async: false,
            url: link,
            success: function (result) {

                content = result;
            }

        }); // end ajax

        $(this).popover(
            {
                html: true,
                content: content
            }).popover('show');

    });

Bootstrap popover没有加载？

1 个答案: