0

オブジェクトコンストラクター内には、addToViewport()という名前のメソッドがあります。このメソッドは、画像をプリロードした後に画像を表示するだけの役割を果たします。

window.onload = function(){

            function ViewportObject(){
                this.src = "https://chart.googleapis.com/chart?cht=qr&chs=500x500&chl=asdasdasd&choe=UTF-8&chld=L|0";
                this.addToViewport = function(){
                    // Determine the DOM object type to create
                        var DOM_elem = "img",
                            obj = $(document.createElement(DOM_elem)),
                            img = new Object();

                            obj.addClass("object");
                            obj.css({"z-index":"100","width":"300px","height":"auto"});

                            // Preload the image before rendering it and computing its size
                            img.src = this.src;
                            img.onload = function(){

                                obj.attr("src",this.src);
                                obj.appendTo("body");
                            }                       

                }
            }

            var o = new ViewportObject();   
            o.addToViewport();
        }

私が遭遇した問題は、スクリプトが「onload」イベントハンドラーブロックに入らないため、画像が表示されないことです。ライブでチェックアウトできるように、上記と同じスクリプトを使用したWebページをhttp://picselbocs.com/test/にまとめました。

私がここで間違っているのは何ですか?

4

1 に答える 1

3

これを試して:

これを変える

img = new Object();
....
img.src = this.src;
img.onload = function(){

    obj.attr("src",this.src);
    obj.appendTo("body");
} 

img = new Image();
....
img.onload = function(){

    obj.attr("src",this.src);
    obj.appendTo("body");
} 
img.src = this.src;
于 2012-09-24T18:38:48.453 に答える