-1

これが関数のスニペットです。各画像の元のサイズを取得しています。次に、単純なifステートメントを実行したいのですが、変数'imageWidth'にアクセスできません。'theImage.onload = function()'の外で'undefined'を取得します。なぜそれは範囲外ですか?

    var parentWidth = $('figure.pack_image').width();
    var screenImage = $('figure.pack_image img');
    var imageWidth = '';

    screenImage.each(function () {

        var theImage = new Image();
        theImage.src = $(this).attr('src');

        theImage.onload = function() {
            imageWidth = this.width;

        }

        if (imageWidth > parentWidth) {
        ...
4

1 に答える 1

2

「範囲外」ではなく、まだ値がないだけです。imageWidthを設定するまではテストできず、.onload呼び出しは非同期です。

.onload関数内でテストを開始する必要があります。

theImage.onload = function() {
    imageWidth = this.width;
    if (imageWidth > parentWidth) {
        ...
    }
}

または、遅延コールバックを使用onloadして、後続の処理からロジックをネスト解除します。

var gotImage = $.Deferred();
theImage.onload = function() {
    gotImage.resolve(this);
}

gotImage.done(function(img)) {
    if (img.width > parentWidth) {
         ...
    }
});
于 2012-10-30T12:25:12.137 に答える