.load()

类别：已淘汰 > 淘汰于1.8 | 事件 > 文档载入 | 删除

.load( handler )返回类型：jQueryversion deprecated: 1.8, removed: 3.0

描述：把一个事件处理函数绑定到“load”JavaScript事件。

此方法是.on( "load", handler )的简写。

某元素当它或它的所有子元素都已经完全载入时，load事件发送到该元素。此事件或以发送到与URL相关联的任何元素：图像、脚本、frame、iframe，以及window对象。

例如，请考虑带有简单图像的网页：

1
 
<img src="book.png" alt="Book" id="book">

事件处理函数可以绑定到图像上。

1
2
3
 
$( "#book" ).load(function() {
  // Handler for .load() called.
});

一旦图像已经载入，将调用处理函数。

一般情况下，不需要等待所有图像都完全载入。如果代码可以较早执行，最好把它放在一个发送到.ready()方法的处理函数中。

Ajax模块也有一个方法命名为.load()。哪个被引发，取决于传递的参数的集合。

关于配合图像使用load事件的注意事项

使用.load()简写方式，开发员试图解决的一个共同挑战是当一个图像（或图像的集合）已经完全载入时，执行一个函数。关于这，有一些已知的注意事项需要被注意到。如下：

  • load事件无法跨浏览器一致性起作用或可靠地起作用。
  • 如果图像的src被设置为与以前相同的src，在Webkit中无法正确地引发load事件。
  • load事件无法正确地沿着DOM树向上冒泡
  • 如果图像已经驻留在浏览器的缓存中，将停止引发load事件。

注意：.live()方法和.delegate()方法不能用来侦测iframe的load事件。load事件不能正确地向上冒泡到父文档，Firefox、IE9和Chrome不能设置event.target，但是event.target对事件委托来说是必不可少的。

示例：

当网页完全载入，包括图像也载入时，运行一个函数。

1
2
3
 
$( window ).load(function() {
  // Run code
});

当每个图像载入时，把类bigImg添加到所有高度大于100的图像。

1
2
3
4
5
 
$( "img.userIcon" ).load(function() {
  if ( $( this ).height() > 100) {
    $( this ).addClass( "bigImg" );
  }
});