jquery data（）方法不总是有效吗？

我在创建可靠的jquery代码时遇到了非常严重的问题，该代码将图像的大小调整为其父div的宽度。有时它工作正常，有时就是不行。一开始我以为IE只是在烦我，但有时候safari、firefox或chrome也不会启动我的方法

    $(".post-body img").each(function() {  
        $(this).data('width', $(this).width());
        $(this).data('height', $(this).height());
    });

我正在window.load-function中保存数据方法的宽度和高度宽度

function setimgwidth() {
    var bw = $('.post-body').width();
    $(".post-body img").each(function() {   
            if (bw < $(this).data('width')) {
                $(this).attr( 'width', Math.round(bw) );
                //calculate ratio height
                var newHeight = (bw / $(this).data('width')) * $(this).data('height');
                $(this).attr( 'height', Math.round(newHeight) );
            }
    });
}

之后，我将调用setimgwidth（）函数

function setimgwidth() {
    var bw = $('.post-body').width();
    $(".post-body img").each(function() {   
            if (bw < $(this).data('width')) {
                $(this).attr( 'width', Math.round(bw) );
                //calculate ratio height
                var newHeight = (bw / $(this).data('width')) * $(this).data('height');
                $(this).attr( 'height', Math.round(newHeight) );
            }
    });
}

---

console总是告诉我图像的宽度和高度为0。

在您使用的某个位置

$（this）.attr（'width'）

，而在另一个示例中，您使用的是

$（this）.width（）

。请尝试

.width（）

和

.height（）

，我认为这两种方法都是您应该使用的：

$(".post-body img").each(function() {  
    $(this).data('width', $(this).width());
    $(this).data('height', $(this).height());
});

$(".post-body img").each(function() {   
        if (bw < $(this).data('width')) {
            $(this).width(Math.round(bw));
            //calculate ratio height
            var newHeight = (bw / $(this).data('width')) * $(this).data('height');
            $(this).height(Math.round(newHeight));            
        }
});

请记住，

width（）

和

height（）

返回实际的内容宽度和高度，而不管CSS属性如何，因此只有在内容/图像或任何内容完全加载后才能捕获这些值。

代码审阅（这不是答案）

我重新分析了你的代码。我相信现在它的可读性要大得多

function setImgWidth() {
    var b = $(".post-body");
    var bw = b.width();

    b.find("img").each(function() {
            var t = $(this);
            var tw = t.data("width");
            var th = t.data("height");

            if ( bw < tw ) {
                t
                    .width(Math.round(bw))
                    .height(Math.round((bw / tw) * th));
            }
    });
}

函数setImgWidth（）{
var b=$（“.post body”）；
var bw=b.宽度（）；
b、 查找（“img”）。每个（函数（）{
var t=$（本）；
var tw=t.数据（“宽度”）；
var th=t.数据（“高度”）；
if（bw

在

窗口中也被调用
设置imgwidth
。加载

？是！如果我使用console.debug（$（this.data（'width'））；有时是0有时是真实尺寸。我只是不明白为什么它不总是起作用。我想知道是否有更好的方法来满足我的需求？奇怪的是，console.defairst总是告诉我（$this.data.（'widt'）和'height'0是。但事实并非如此。

$(".post-body img").load(function() {  
    $(this).data('width', $(this).width());
    $(this).data('height', $(this).height());
});

function setImgWidth() {
    var b = $(".post-body");
    var bw = b.width();

    b.find("img").each(function() {
            var t = $(this);
            var tw = t.data("width");
            var th = t.data("height");

            if ( bw < tw ) {
                t
                    .width(Math.round(bw))
                    .height(Math.round((bw / tw) * th));
            }
    });
}