2013-04-30 205 views
0

什麼是對動態頁面內容創建qTip2最好的辦法..下面是jQuery的用於生成頁面動態內容創建頁面的動態內容qTip

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可以創建..

回答

0

我發現大的html更新,它需要時間爲DOM元素進行更新。我確實相信這是你的問題。調用.qtip函數時,DOM尚未創建。

「適當的」解決方案是將回調掛鉤到DOM的操作中,然後綁定qtip。

這裏不過是一個資源弄清楚如何做到這一點:

Detect element content changes with jQuery


我的 「黑客」 是以下幾點:

相反的:

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

我這樣做過:

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

爲數據集使用適當的時間間隔。

NOTE:這是一個HACK。不同計算機上的不同瀏覽器將以不同的速度執行...;)