将jQuery tipsy与jQuery ON集成

Question

我有一个网站，与无限的页面，并动态加载的内容。

目前我正在使用jQuery tipsy插件，需要在任何动态添加内容到站点的函数中调用它(以获得此新内容的工具提示)。我目前正在将我的绑定更改为ons，这将有助于实现这一点，点击和其他事件有关。

我现在经常重复的代码是：

   $("[data-tooltip]").tipsy({settings here});

是否可以在上使用jQuery，并将其绑定到正文，如果将内容添加到正文中，则内容(如果它具有data-tooltip属性)将自动执行tipsy函数？

例如：

 $("body").on("something","[data-tooltip]", function (e) { 
         $("[data-tooltip]").tipsy({settings here}); 
 });

谢谢

Answer 1

您可能知道，在每次加载新内容后实际应用tipsy会好得多：

$.ajax({
   ..
   success: function( newHtml ) {
       $('#container').append( newHtml );
       $('#container .tipsy').tipsy({
           /** Your settings **/
       });
   }
}); 

为了达到你所要求的目标，你必须使用某种“倾听者”。以原始的基本形式等待插入的任何新的DOM元素：

function listenForNewToolTips() {
    $('.someclass[data-tooltip]:not([data-hastipsy])').tipsy({ 
           /** Apply data-hastipsy='true' **/ 
    });
    //Look again in 1000 milliseconds.
    setTimeout( listenForNewToolTips, 1000 );
}

上面的内容是非常不够的，因为它将是一个恒定的循环。on监听许多事件，但令人惊讶的是，监听每个DOM元素更改的事件并不多：

• Mutation Observers (新的、非交叉browser)
• DOMNodeInserted (Deprecated)
• setTimeout()