0

我有以下代码：

function fn_get_natural_dim(){
    var width = this.width;
    var height = this.height;

    var ratiow = width/600;
    var ratioh = height/300;
    $("#output").append(img_name,",");

    if(ratiow>=ratioh)
        {
        height = height/ratiow;
        $(slide_image).css("width","600px");
        $(slide_image).css("height",height);
        var margin = (300-height)/2;
        $(slide_image).css("margin-top",margin);
        }
    else
        {
        width = width/ratioh;
        $(slide_image).css("width",width);
        $(slide_image).css("height","300px");
        var margin = (600-width)/2;
        $(slide_image).css("margin-left",margin);
        }
}
var max_count = $(".slider").children().length;
for(var count=1;count<=max_count;count++)
    {
    var count_string = count.toString();
    var img_name = "img" + count_string;
    var slide_image = document.getElementById(img_name);

    var img = new Image();
    img.onload = fn_get_natural_dim;
    img.src = $(slide_image).attr("src");
    }
});

对于每个图像（我目前有三个），我得到它的自然尺寸，以便我可以计算适合 600x300 div 所需的边距。

但我只为最后一个工作，即第三个。换句话说，在#output 中，它显示“img3,img3,img3”（由 $("#output").append(img_name,","); 调用）我如何让它显示“img1,img2 ,img3,”??

4

2 回答 2

2

你可以这样做：

    img.onload = (function(img_name, slide_image) {
        return function() {fn_get_natural_dim(img_name, slide_image); };
    })(img_name, slide_image);

并更改fn_get_natural_dim为将图像名称作为参数：

function fn_get_natural_dim(img_name, slide_image) {

上面的代码捕获img_name闭包变量中的每个连续值。

于 2013-07-24T12:17:02.790 回答
-1

编辑

正如 Barmar 指出的那样，这个解决方案并不完全正确。我会留下它，因为这是一个相当常见的错误，重要的是要注意他的解决方案和我自己的解决方案之间的区别。

传入img_name你的fn_get_natural_dim函数：

function fn_get_natural_dim( img_name ) { ... }

然后这样称呼它：

img.onload = function() { fn_get_natural_dim(img_name); };
于 2013-07-24T12:04:43.453 回答