0

プリロードされたJS 画像オブジェクトまたは画像 urlを受け取る関数があります。これは変数として渡されます。photo

「写真」変数が文字列かどうかを確認します。その場合は、新しい画像オブジェクトを作成し、onload イベントを使用して、新しく作成された画像オブジェクトを渡す generateSlide() 関数を起動します (以下を参照)。

renderSlide: function (slideindex, photo, external, count, text) {
        var self = this;
        var image = new Image();
        if (typeof (photo) == 'string') {
            image.onload = function () {
                self.generateSlide(slideindex, image, external, count, text);
            };
            image.src = photo;
        } else {
            image.src = photo.src;
            self.generateSlide(slideindex, image, external, count, text);
        }
 },

'photo' var がプリロードされた JS 画像オブジェクトである場合、関数自体を実行して画像オブジェクトを generateSlide(); に渡すだけです。

すべてがうまく機能しますが、何らかの理由で IE 9 では、「写真」変数を単純に直接 generateSlide() 関数に渡すことができません。新しい画像オブジェクトを作成し、写真オブジェクトの src 属性と一致するように src を設定する必要があります。

これは私には意味がありません。なぜそうなるのか理解できませんか？

photo var が実際の JS 画像オブジェクトである場合、別の場所に読み込まれていることが確認されます。(アセットをプリロードしています);

要約すると、上記のコードは正常に動作しますが、新しい画像オブジェクトを作成する必要があり、元の画像オブジェクトを単純に渡すことができない理由を誰か説明できますか? よりエレガントなソリューションはありますか？これまでのところ、上記の方法で問題に気づいたことはありませんが、このアプローチを使用した場合の落とし穴を知っている人はいます。

前もって感謝します

4

1 に答える 1

1

範囲の問題のようです。正しい写真がキャプチャされるように、呼び出しをクロージャーに入れてみましたか?

renderSlide: function (slideindex, photo, external, count, text) {
        var self = this;

        if (typeof (photo) == 'string') {
           var image = new Image();
            image.onload = function () {
                self.generateSlide(slideindex, image, external, count, text);
            };
            image.src = photo;
        } else {
          (function(photo){
            self.generateSlide(slideindex, photo, external, count, text);
          })(photo);
        }

}、

于 2012-11-16T16:45:03.853 に答える