0

在动态页面内容上创建 qTip2 的最佳方法是什么。下面是用于生成页面动态内容的 jquery

function display(view) {
    if (view == 'list') {
        $('.product-grid').attr('class', 'product-list');

        $('.product-list > div').each(function(index, element) {
            html  = '<div class="right">';
            bla bla         
            html += '  <div class="wishlist">' + $(element).find('.wishlist').html() + '</div>';
            html += '</div>';           

            $(element).html(html);
        });     

        $('.display').html('<span class="displaytext"><span class="" title="<?php echo $text_grid; ?>"></span></span>');

        $.cookie('display', 'list'); 
    } else {
        $('.product-list').attr('class', 'product-grid');

        $('.product-grid > div').each(function(index, element) {
            html = '';

            html += '<div class="name">' + $(element).find('.name').html() + '</div>';
            html += '<div class="wishlist">' + $(element).find('.wishlist').html() + '</div>';

            $(element).html(html);
        }); 

        $('.display').html('<span class="displaytext"><span class="listtext" title="<?php echo $text_list; ?>"></span>');

        $.cookie('display', 'grid');
    }
    $('span[title]').qtip(); **// I have called the qTip2 function here but it only activates for $('.display').html(); the qtip2 doesn't activate for $(element).html(html);**
}


view = $.cookie('display');

if (view) {
    display(view);
} else {
    display('grid');
}

我也尝试过做一个回调函数，但不确定它应该在哪里，因为我还是 Javascript 的新手。我不想更改 javascript 代码，我只想能够创建 qtip2 函数，以便可以创建所有加载内容的 qTip2 ..

4

1 回答 1

0

我在大型 html 更新中发现，更新 DOM 元素需要时间。我相信这是你的问题。.qtip调用该函数时，DOM 尚未完全创建。

“正确”的解决方案是将回调挂钩到 DOM 的操作中，然后在那时绑定 qtip。

这里只是一个资源来弄清楚如何做到这一点：

使用 jQuery 检测元素内容的变化

我的“黑客”如下：

代替：

$('span[title]').qtip();

我这样做了：

setTimeout("$('span[title]').qtip();", 1000);

为您的数据集使用适当的间隔。

注意：这是一个 HACK。不同计算机上的不同浏览器将以不同的速度运行...... ;)

于 2013-05-29T21:32:43.323 回答