0

非常に単純な文字列比較がありますが、チェックは常に失敗します。幅<img>に基づいてロードされたさまざまな画像をロードしようとしています。window

$(document).ready(function() {
    var width = $(window).width();
    console.log(width);
    $('.slider-image').each(function() {
        resize_image( $(this), width );
    });
});

$(window).resize(function() {
    var width = $(window).width();
    $('.slider-image').each(function() {
        resize_image( $(this), width );
    });
});

function resize_image( image, width ) {
    console.log(width);
    if( width >= 480 && width < 768 ) {
        if(image.attr( 'src' ) != image.data( 'phone-src' ) ); {
            console.log( 'resize phone' );
            image.attr( 'src', image.data( 'phone-src' ) );
        }
    } else if ( width >= 768 && width < 960 ) {
        if(image.attr( 'src' ) != image.data( 'tablet-src' ) ); {
            console.log( 'resize tablet' );
            image.attr( 'src', image.data( 'tablet-src' ) );
        }
    } else if ( width >= 960 ) {
        if(image.attr( 'src' ) != image.data( 'desktop-src' ) ); {
            console.log( 'resize desktop' );
            image.attr( 'src', image.data( 'desktop-src' ) );
        }
    }
};

今、私がしたいことは、don't replace the src, if the width remains within the borders. src属性に既にその属性があるかどうかを確認してこれを実行しようとしていdataますが、Chrome インスペクターでは両方の属性が同じですが、常に等しくないため、文字列チェックは失敗します。なぜこれが起こるのですか？

ちなみに、どちらの文字列も画像の URL です。

4

3 に答える 3

1

コンソール ログの後に余分な括弧があるのはなぜですか?

console.log( 'resize phone' ));

比較srcとdata属性を確認したところ、一致しました。あなたの画像がdata-phone-src=""などでタグ付けされていない限り、行がsrcの設定を妨げていると思います.

于 2013-02-28T16:39:27.300 に答える
0

問題は、すべてのifステートメントの後ろに卑劣なセミコロンがあることでした...それらを削除すると、機能しました。

于 2013-03-11T22:49:16.313 に答える
0

src が文字列プリミティブまたは String() であるかどうかを確認できます。 

new String("hi") == new String("hi");  // false
于 2013-02-28T16:11:56.067 に答える