无限滚动和图片库问题

Question

我已经在我在这里建立的网站上设置了无限滚动：http://richardgordoncook.com/fg/

我正在为图片库使用 Wordpress 插件，我对其进行了一些操作以将鼠标悬停在文件名等上。这一切都很好，直到无限滚动启动并且第一页之后的任何帖子似乎停止使用图库功能和真正的任何 javascript。

有什么想法吗？当您在上面的站点链接上进行测试时，您会得到一个想法。

Answer 1

无限滚动添加的元素在创建后需要将 JavaScript 事件连接到它们。 请参阅 jQuery 的 .live() 函数以获取有关如何轻松执行此操作的更多信息。

本质上，你替换

$('.myclass').mouseover(function(){})

与

$('.myclass').live('mouseover', function(){});

并且 jQuery 会在新的 dom 元素添加到页面后自动连接所有额外的事件。

更新

好的，忘记.live() 方法。看起来插件有一个回调函数，每当它向页面添加新元素时都会引发该函数。

$(elem).infinitescroll(options,[callback]);

回调函数记录为

function(arrayOfNewElems){
 
     // optional callback when new content is successfully loaded in.
 
     // keyword `this` will refer to the new DOM content that was just added.
     // as of 1.5, `this` matches the element you called the plugin on (e.g. #content)
     //                   all the new elements that were found are passed in as an array
 
}

您应该使用此回调将事件处理程序连接到页面上的新元素。它看起来像这样

function(elements)
{
    $(elements).mouseover(function(){});
    $(elements).mouseout(function(){});
}

根据您需要执行的操作，您可能需要使用 for 循环并单独迭代每个项目，而不是作为一个批次对它们进行操作。