javascript - 为什么 $(this) 可以与 .hover() 一起使用，但不能与 .ready() 一起使用？

Question

所以，我试图让 backstretch.js 与从数据库加载的多个 div 一起工作。

但我无法为每个 div 获得单独的图像。

这非常有效，当我将框悬停时，背景会显示出来，但我不想在页面加载后立即加载它。

 $(".tournament-thumb").hover(
    function(){
        $(this).backstretch($(this).data("url"));
       }
);

我已经用.ready()试过了，没有任何结果，这似乎没有注册 "$(this)" 吗？：

     $(".tournament-thumb").ready(
    function(){
        $(this).backstretch($(this).data("url"));
       }
);

这是HTML：

<div class="tournament-thumb" data-url="images/image.jpg"></div>

请帮助我......如果有比这更好的方法，请回复：）

score 3 · Accepted Answer

.ready() 方法只能在匹配当前文档的 jQuery 对象上调用，所以可以省略选择器

所以你只能使用$(document)forready()方法。

score 0 · Accepted Answer

可能最好的解决方案是将委托绑定到文档对象，例如

 $(document).on('hover','.tournament-thumb',function(){
    $(this).backstretch($(this).data("url"));
 });

score 0 · Accepted Answer

好的，我用 jQuery.each 解决了它

$.each($(".tournament-thumb"), function() {
   $(this).backstretch($(this).data("url"));
});

3 回答 3