Question

我附加了图像，我做

$(document).ready(function(){
$('.shop_banner img').capty({height:150});
});

在chrome中调试capty代码时alert($this.height())为零，所以包装器隐藏图像。我知道有些浏览器希望图像完全加载但是如果我使用ready并不意味着它在页面完全加载后执行？我该怎么办？

Answer 1

不，load并准备就绪并不是一回事。

你可以做到

$(window).load(function(){
    $('.shop_banner img').capty({height:150});
});

一旦DOM准备好，

ready就会调用你的函数，这并不意味着图像被加载。

来自文档：

当JavaScript提供用于执行代码的load事件时   页面呈现，此事件在所有资产之前都不会被触发   如图像已被完全接收。在大多数情况下，   只要DOM层次结构完全可以运行脚本   建造。传递给.ready（）的处理程序是保证的   在DOM准备好之后执行，所以这通常是最好的地方   附加所有其他事件处理程序并运行其他jQuery代码。使用时   依赖于CSS样式属性值的脚本，这很重要   以前引用外部样式表或嵌入样式元素   引用脚本。

在代码依赖于加载的资产的情况下（例如，如果   图像的尺寸是必需的），代码应放在一个   改为加载事件的处理程序。

Answer 2

我通常在对图像执行任何特殊操作之前对图像使用加载函数。

$(function() {
    $('.shop_banner img').load(function() {
        $(this).capty({height:150});
    });
});

铬零的jquery高度

2 个答案: