0

我正在加载一个 json 文件并将其解析为 Javascript 中的数组。其中一个元素是图像的路径。我还没有准备好加载图像，但我需要获取图像的高度。我知道如何使用以下代码来做到这一点（在其他 stackoverflow 页面上找到）

function getimageheight(img) {
    var tmpImg = new Image();
    tmpImg.onload = function() {
        var ht = this.height;   
        return ht+0;
    }
    tmpImg.src = img;
}

如果我尝试在循环中调用此函数，它会返回 undefined，因为图像的加载运行速度比循环慢。我的实际代码是这样的：

        var j = 0;
        $.each(cat.placemarks, function(index, mark) {
            markers[cat.name][j] = [];
            markers[cat.name][j].name = mark.name;
            markers[cat.name][j].title = mark.title;
            markers[cat.name][j].markerURL = mark.markerURL;
            markers[cat.name][j].imageURL = mark.imageURL;
            markers[cat.name][j].imageHEIGHT = getimageheight(projpath+mark.imageURL);
            j++;
        });

如果我调用该函数一次，它就可以工作。但是在循环中调用它不会。我怎样才能解决这个问题？

4

2 回答 2

2

如果您将数据对象的引用存储在用于加载它的 Img 对象中，您可以在加载完成后设置其属性的值。希望这是有道理的......在加载完成之前，您的数据将无法使用。这是代码

var total=cat.placemarks.length;//if an array, otherwise use another each cycle to get object count
var loaded=0;

$each(cat.placemarks, function(index, mark) {
    markers[cat.name][j] = [];

    var tmpImg = new Image();
    tmpImg.refToObjWithNameOfYourChoice=markers[cat.name][j];
    tmpImg.onload = function() {
        this.refToObjWithNameOfYourChoice.imageHEIGHT=this.heigh;
        loaded++;
        if(loaded==total){
            //markers data is ready to use - add function callback herer or sumthin'
        }
    }
    tmpImg.src=projpath+mark.imageURL;

    markers[cat.name][j].name = mark.name;
    markers[cat.name][j].title = mark.title;
    markers[cat.name][j].markerURL = mark.markerURL;
    markers[cat.name][j].imageURL = mark.imageURL;
    j++;

});
于 2013-08-24T20:27:12.693 回答
0

markers[cat.name][j].imageHEIGHT是未定义的，因为getImageHeight()没有返回任何东西。当然，图像加载会比你的循环慢得多，所以返回一些东西each()对你没有任何好处。getImageHeight()您必须设置load()回调以确定已加载的图像并更新相应markers元素的高度。

于 2013-08-24T19:55:38.783 回答