jquery 和 ajax 工具提示不适用于实时加载的内容

Question

我使用 Ruby on Rails 和 Jquery 作为我的库和 2 个插件，但这应该是一个与插件无关的问题。

我正在使用 jquery.pageLess 插件，该插件对内置于 rails 的分页进行 ajax 调用，以便在滚动到底部时将新项目加载到页面上（很像新的谷歌图像布局）。

不过，我还使用了 Tipsy 插件将工具提示添加到正在加载的链接的图像部分。

这些工具提示适用于未加载 pageLessly 的项目（它们已经在最初加载的页面上）但不会显示在 pageLessly 加载的项目上。我的猜测是 pageLess 会发出实时更新页面的请求，但提示工具提示插件不会，因此不会加载到 pageLess 返回的任何新链接上。

如何使我的 jQuery 函数在实时加载/ajaxed 内容的上下文中工作？

Answer 1

$('selector').tipsy({
  live: true
});

http://onehackoranother.com/projects/jquery/tipsy/

支持现场活动
使用选项 {live: true} 支持实时事件。需要 jQuery ≥ 1.4.1，实时工具提示不支持手动触发。

编辑
另一种方法是在创建新元素后将醉酒绑定到新元素。示例：

$('selector').tipsy();

// post, get, ajax, etc
$.post(..., function(data) {
  // in the return function, first create the new elements
  ...

  // call on the tipsy method again
  // the selector will now also match the newly created elements
  $('selector').tipsy();
});

如果您的tipsy 方法中有很多变量并且您不想重复它，那么创建一个单独的函数可能会更容易。示例：

// create the function 
function setupTipsy() {
  $('selector').tipsy({
    html: true,
    gravity: 'w',
    etc..
  });
}

// call on the function when the document has been loaded
setupTipsy();

// post, get, ajax, etc
$.post(..., function(data) {
  // in the return function, first create the new elements
  ...

  // call on the same function again
  setupTipsy();
});