Question

快速总结..我的一个表元素上有一个jQuery工具提示，具有特定的数据属性来选择它。它工作得很好，发出ajax请求，返回数据并将其放在工具提示中。唯一的问题是每次时间我将鼠标移到table元素上再次触发ajax请求。

    $('p').tooltip({ 
        items: "[data-whatever]",
        content: function(){
            var el = $(this),
                content = el.data('ajax-content');
            if(content)
                return content;    
            return 'waiting for ajax';
        },
        open: function(){
            var elem = $(this),
                id = elem.data('whatever');
            $.ajax('/echo/html/' + id).always(function(res)  {
                elem.tooltip('option', 'content', res[0].label);
                elem.data('ajax-content', res[0].label);
            });
        }
    });

这一切都很好（我对代码进行了一些更改，因此它与我所做的不完全相同，因为它包含在我的工作模块模式中）..但是有一种简单的方法来只打开功能一次？

任何帮助将不胜感激！

Answer 1

试试这个，在元素数据中存储ajax响应，现在如果数据中存在工具提示，则检查打开事件，如果是，则显示其他cal ajax。

$('p').tooltip({ 
    items: "[data-whatever]",
    content: function(){
        var el = $(this),
            content = el.data('ajax-content');
        if(content)
            return content;    
        return 'waiting for ajax';
    },
    open: function(){
        if($(this).data("ajax-content") == undefined) {
            var elem = $(this),
                id = elem.data('whatever');
            $.ajax('/echo/html/' + id).always(function(res)  {
                elem.tooltip('option', 'content', res[0].label);
                elem.data('ajax-content', res[0].label);
            });
        }
        else {
            $(this).tooltip('option', $(this).data("ajax-content"));
        }
    }
});

Answer 2

您可以检查是否已设置'ajax-context'数据。如果是这样，请不要触发ajax请求。

$('p').tooltip({ 
    items: "[data-whatever]",
    content: function(){
        var el = $(this),
            content = el.data('ajax-content');
        if(content)
            return content;    
        return 'waiting for ajax';
    },
    open: function(){
        var elem = $(this),
            label = elem.data('ajax-content');
        if (label) {
          elem.tooltip('option', 'content', label);
        } else {
          var id = elem.data('whatever');
            $.ajax('/echo/html/' + id).always(function(res)  {
                elem.tooltip('option', 'content', res[0].label);
                elem.data('ajax-content', res[0].label);
            });
        }
    }
});

带有ajax请求的jQuery工具提示，如何只触发一次

2 个答案: