QTip2 ajax彈出不起作用

Question

我想通過ajax顯示qtip彈出窗口沒有成功。我得到了下面的代碼，但似乎無法檢測到哪裏會出錯。幫助將不勝感激。

<script type="text/javascript"> 
$(document).ready(function() 
{ 
    $('.tiplink').qtip({ 
     content:{ 
      var id = $(this).attr('rel'); 
      text: '<img class="" src="../images/loader.gif" alt="Loading..." />', 
      ajax:{ 
       url: 'pops.php', 
       type: 'POST', 
       loading: false, 
       data: 'id=' + id 
      } 
     }, 

     show: 'mouseover', // Show it on mouseover 
     hide: { 
      delay: 200, 
      fixed: true // We'll let the user interact with it 
     }, 
     style: { 
      classes: 'ui-tooltip-light ui-tooltip-shadow', 
      width: 290 
     } 
    }); 

}); 
</script> 

<a href="#" class="tiplink" rel='1'>show me the popup1!</a> 
<a href="#" class="tiplink" rel='2'>show me the popup2!</a> 
<a href="#" class="tiplink" rel='3'>show me the popup3!</a> 

Answer 1

周圍有一些問題，可以幫助你 here

和qtip的網站 here

教程本身我沒有看到任何其他原因，它不應該，如果你的工作盡一切辦法寫作

Answer 2

我有一個類似的問題;它似乎與以下事實有關：$（'。myclass'）。qtip（{}）不能引用多於一個元素。倘若它（和如你的例子），你需要用的qtip（）的每個（函數（））塊中調用...

對於你的榜樣，下面應該解決您的問題：

$(document).ready(function() 
{ 
    // the each() call I was explaining above this code example 
    $('.tiplink').each(function(){ 

    // Extract your variables here: 
    var $this = $(this); 
    var id = $this.attr('rel'); 

    // Now make your qtip() call 
    $this.qtip({ 
     content:{ 
     text: '<img class="" src="../images/loader.gif" alt="Loading..." />', 
     ajax:{ 
      url: 'pops.php', 
      type: 'POST', 
      loading: false, 
      data: 'id=' + id 
     } 
     }, 
     show: 'mouseover', // Show it on mouseover 
     hide: { 
     delay: 200, 
     fixed: true // We'll let the user interact with it 
     }, 
     style: { 
     classes: 'ui-tooltip-light ui-tooltip-shadow', 
     width: 290 
     } 
    }); 
    }); // end each(function()) call 
});