動態加載jQuery qTip代碼

對於我正在編寫的應用程序，我需要在提交表單時將內容動態加載到DIV中。動態加載jQuery qTip代碼

這個動態加載的內容需要幾個工具提示，以便在加載時自動顯示（不需要事件觸發它）。我選擇qTip是因爲它有參數來做到這一點，與我發現的大多數其他工具提示不同，它需要觸發工具提示的事件（如onmouseover）。

這是用來實現這一目標的qTip代碼：

 
$(function(){ 
    $('#someelement').qtip({ 
     content: 'This is the message!', 
     show: { ready: true, when: false }, 
     hide: { false }, 
     position: { 
      corner: { 
       target: 'topLeft', 
       tooltip: 'bottomRight' 
      } 
     }, 
     style: { 
         ............ styling code here................ 
      } 
     } 
    }) 
});

這可以在任何形狀或形式，我嘗試它的罰款。該提示已成功顯示。

但是，如果我將此代碼與內容一起動態加載，則不會出現工具提示。

使用Malsup的優秀形式和taconite插件加載內容。

任何想法將不勝感激！

當然，如果你知道另一個方法或插件，我可以用它來達到相同的效果，不要害羞地建議它。 :)

來源

2010-08-11 lvp1138

您說「如果我動態加載此代碼以及內容，則不會出現工具提示」。什麼是「這個代碼」？ – 2010-08-11 08:05:31

「此代碼」是您在上面看到的代碼。我將文本和HTML動態插入頁面。隨着您在上面看到的jQuery代碼，以激活該文本中的幾個工具提示，我正在動態插入。看來qTip並不知道動態插入的文本，並且找不到要應用工具提示的元素。 – lvp1138 2010-08-12 03:21:18

我以前有過這個問題，這就是我解決它的方法。把插件代碼一個單獨的函數中，並調用該文件上的準備：

$(function(){ 
    loadQtip(); 
}); 

function loadQtip() { 
    $('#someelement').qtip({ 
     content: 'This is the message!', 
     show: { ready: true, when: false }, 
     hide: { false }, 
     position: { 
      corner: { 
       target: 'topLeft', 
       tooltip: 'bottomRight' 
      } 
     }, 
     style: { 
         ............ styling code here................ 
      } 
     } 
    }) 
}

然後，當你在添加新的數據再次調用該函數：

... 
complete: function() { 
    loadQtip(); 
}

你會發現事件，如點擊，改變等.live()方法工程，但是當你設置一個插件的元素沒有一個持久的方法。

來源

2010-08-11 08:08:16

我喜歡你的主意！我創建了一個函數，我可以傳遞參數。參數基本上是工具提示的文本，以及將提供工具提示的元素。然後我可以在taconite的EVAL命令中調用這個函數，它基本上是在我調用taconite插件時執行jQuery代碼。但是...似乎qtip仍然不知道動態插入的內容。我可以在「ajax」調用後運行我的函數，並將工具提示應用於網站中的許多元素。但是，似乎qTip沒有意識到我動態插入的元素。 :( – lvp1138 2010-08-12 03:23:42

所以基本上，似乎qTip無法在DOM中找到我剛插入的元素... – lvp1138 2010-08-12 03:24:54

動態加載jQuery qTip代碼

回答

相關問題