0

私は「コンテキスト」の問題に遭遇していると思います。誰かがこの問題にもう少し光を当ててくれることを願っています。

ページ上のすべての画像のソースを削除したい。画像ごとにオブジェクトの配列を作成しました。ソースを非表示にすると、元のオブジェクトのプロパティに影響を与えることなく、変更がリアルタイムで表示されるようにします。クリックイベントで（画面上の）画像を操作したい。

例えば：

$('#moz_iframe').contents().find("img").each(function(index){
    aryImageObjects.push(new imageObject($(this), $('#iframeHolder')));
}); //end each

...

function imageObject(objImg, objHolder) {   
    this.objImg = objImg;
    this.imgSrc = objImg.attr('src');
    //this.objImg.replaceWith('hrm'); <-- this works just fine in this context 
}; //end constructor

...しかし、これは機能しません:

$('#imagesOff').click(function(){
    for (i=0; i<aryImageObjects.length; i++) {
        aryImageObjects[i].objImg.replaceWith('hrm');
    };
}); //end imagesOff click function

また、元のコンストラクター内でオブジェクト メソッドを構築しようとしました。

this.hideImages = function() {
    this.objImg.replaceWith('hrm');
    };

...

$('#imagesOff').click(function(){
    for (i=0; i<aryImageObjects.length; i++) {
        aryImageObjects[i].hideImages();
    };
}); //end imagesOff click function

しかし、それもうまくいかないようです。

どんな助けでも大歓迎です:)

4

1 に答える 1

1

これが私が思いついたものです

$(function() {

    //reference array
    var ref = [];

    (function() {

        //get each image and reference the element and store source
        $('img').each(function() {
            var newImg = {};
            newImg.el = this; //storing the DOM element instead of a jQuery object
            newImg.src = this.src;
            ref.push(newImg);
        });
    }());

    //if the element is clicked, replace using the reference in the array
    $('img').on('click', function() {
        for (i = 0; i < ref.length; i++) {

            //wrap reference in jQuery, and operate
            $(ref[i].el).replaceWith('hrm');
        };

        //img still here even after DOM was replaced
        console.log(ref);
    });
});​
于 2012-04-05T06:27:32.027 に答える