1

在堆栈溢出中搜索时。我发现我也面临一个老问题。但没有人回答。所以只是想知道有人对此有任何想法

如何让 jquery Tooltipster 插件适用于新创建的 DOM 元素？

以下是我的代码

$(document).ready(function() {
$('.test_link').tooltipster({
    interactive:true,   
    content: 'Loading...',
    functionBefore: function(origin, continueTooltip) {
        continueTooltip();      
        // next, we want to check if our data has already been cached
        //if (origin.data('ajax') !== 'cached') {
            $.ajax({
                type: 'POST',
                url: 'example.php',
                success: function(data) {
                    // update our tooltip content with our returned data and cache it
                    origin.tooltipster('content', $(data)).data('ajax', 'cached');
                }
            });
      //  }
    }
});

});
4

2 回答 2

3

我的问题解决了。

只需在 ajax 内容中添加实例化脚本。还设置选项 multiple:true

IE

$(document).ready(function() {
$('.test_link').tooltipster({
    interactive:true, 
    multiple:true,
    content: 'Loading...',
    functionBefore: function(origin, continueTooltip) {
        continueTooltip();      
        // next, we want to check if our data has already been cached
        //if (origin.data('ajax') !== 'cached') {
            $.ajax({
                type: 'POST',
                url: 'example.php',
                success: function(data) {
                    // update our tooltip content with our returned data and cache it
                    origin.tooltipster('content', $(data)).data('ajax', 'cached');
                }
            });
      //  }
    }
});

});

它在 Firefox 中对我有用。但没有在其他浏览器中测试

于 2014-04-24T09:37:44.470 回答
2

我知道这是一个旧帖子，问题已经解决，但我最近需要类似的东西。

在每个 ajax 函数上添加初始化不是一个解决方案，因为我们在页面上动态加载了几个内容，所以找到的最简单的解决方案是：

$(document).on('mouseenter', '[data-toggle="tooltip"]', function(){
        if ($(this).is('.tooltipstered')) {
            // Do nothing
        } else {
            $(this).tooltipster({
                delay: 50,
                // Your other Tooltipster options
            });
            $(this).mouseover();
        }
});

$('[data-toggle="tooltip"]')作为OP的$('.test_link')。

if阻止文件的重复初始化mouseenter。

于 2019-03-27T10:24:11.983 回答