4

我有图像被动态添加到页面,我似乎无法让“加载”事件与 live() 一起动态工作。

这是我目前拥有的代码:

$('#largeImg' + nextUniqueItemID).hide();
$('#largeImg' + nextUniqueItemID).live('load' , function() {
    $('#loader' + nextUniqueItemID).hide();
    $('#largeImg' + nextUniqueItemID).show();
});

'#largeImg' + nextUniqueItemID在函数前面添加到页面的图像并且'#largeImg' + nextUniqueItemID是加载图像。

我觉得好像我可能在滥用“live”,因为它实际上并不需要监听器,而是立即触发事件。

感谢你的帮助。我尝试了“绑定”,但从未触发。我也尝试过消除负载,但这没有用。有没有办法将侦听器附加到指示图像何时完成加载的事件?

4

5 回答 5

6

我认为 jQuery 文档可能在这方面有点误导,除非它正在做一些非常特别的事情来解决问题。

图像等元素上的加载事件不会冒泡。1 , 2

由于它们没有冒泡,因此document不知道是否触发了加载事件。

因为document不知道加载事件,live 将变得无用,因为 live 依赖于冒泡到文档的事件,一旦它们这样做,它将事件目标与它已经在文件中的选择器匹配,如果有任何匹配,为该元素触发事件处理程序。

例如,假设您要注册以下直播活动:

$("#container > input").live("change", function() {
    alert("changed");
});

然后 jQuery 将在文档对象上添加一个更改事件侦听器(如果它尚不存在)(类似于):

$(document).bind("change", function() {
    ..
});

当任何更改事件冒泡到文档时,它会遍历每个已注册的选择器,并检查给定选择器的任何结果节点是否包含事件目标(事件源自的元素)。如果存在,则为该事件目标触发相应的“实时”事件处理程序。

如果文档一开始就不知道该事件,那么这一切都是不可能的。

除非我弄错了并且 jQuery 对此有一些秘诀,否则您应该直接绑定 load 事件,而不是通过 live 进行。

$("selector").bind("load", function() { .. });
于 2010-06-15T09:53:03.243 回答
1

这段代码在哪里??

$('#largeImg' + nextUniqueItemID).hide();
$('#largeImg' + nextUniqueItemID).live('load' , function() {
$('#loader' + nextUniqueItemID).hide();
$('#largeImg' + nextUniqueItemID).show();
});

如果这是在 jQuery ajax 的回调中,则不必使用.live(), 使用.bind().

于 2010-06-15T08:49:07.390 回答
0

我会看一下文档: http ://api.jquery.com/live/

* In jQuery 1.3.x only the following JavaScript events (in addition to custom events) could be bound with .live(): click, dblclick, keydown, keypress, keyup, mousedown, mousemove, mouseout, mouseover, and mouseup.

    * As of jQuery 1.4 the .live() method supports custom events as well as all JavaScript events. As of jQuery 1.4.1 even focus and blur work with live (mapping to the more appropriate, bubbling, events focusin and focusout).
    * As of jQuery 1.4.1 the hover event can be specified (mapping to "mouseenter mouseleave").

无论是什么触发了创建,都应该触发您在load事件中使用的项目的隐藏和显示。

于 2010-06-15T08:37:25.977 回答
0

您是否尝试过使用属性选择器而不是直接 ID?

$('#largeImg' + nextUniqueItemID).hide();
$('[id=largeImg' + nextUniqueItemID + ']').live('load', function() {
    $('#loader' + nextUniqueItemID).hide();
    $('[id=largeImg' + nextUniqueItemID + ']').show();
});
于 2010-06-15T20:09:02.360 回答
-1

我最终做的是将加载事件直接放在我的图像的 onLoad="" 事件中。那成功了。

于 2010-06-15T20:04:49.080 回答