0

ポップアップの左側に動的に生成されたサムネイル画像があり、画像をクリックすると、その画像が右側に表示されます。

以下のコードを使用しています。

    $.ajax({  
                    type: "POST",
                    url:  "/buildyourholiday/placeimages",
                    data: "srcid="+cityid,
                    success: function(data){
                        var objsrc = jQuery.parseJSON(data);
                        var src="";
                        $(".photoright").append().empty();
                        $.each(objsrc, function(index, obsrc){
                            src += '<ul>'+
                                '<li><a href="#"><img id="citythumb" onclick="sliderimage(this)" src="/images/city/thumbs/'+obsrc.img_filename+'" width="100" height="100"></a></li>'+
                                '</ul>';
                        });
                        $(".photoright").append(src);
                        function sliderimage(image)
{
    alert("sdf");
    alert(image);
}
                    }
                });

firebug を実行すると、sliderimage は関数ではありません。追加後に onclick イベントを使用すると、最初の画像しか取得できませんが、複数の画像があります。任意の画像のクリックで onclick が機能するようにします。それについてどうやって行くのですか？

ありがとう、

4

3 に答える 3

1

id="citythumb"class一意である必要があります。class="citythumb"

$(".photoright").on('click', 'img', function(e){
   e.preventDefault(); // for link
   alert(this);
});

属性を変更すると、次のようにid置き換えることもできますimg.citythumb

于 2012-10-03T08:03:45.807 に答える
0

ここで、イベントが要素の祖先に関連付けられているイベント委任アプローチを試してください..

そうすることで、バブリング効果のためにクリックイベントが画像要素に関連付けられます...

$(".photoright").on('click', 'img', function(){
   alert(this);
});

ドキュメント内の ID が一意であることを確認してください。

したがって、id="citythumb"の代わりにclass=" citythumb" を宣言します。

于 2012-10-03T08:05:46.457 に答える
0

Sliderimage() 関数を Ajax 呼び出しの外に移動してください

 $.ajax({  
 });

 function sliderimage(image){     
   alert("sdf");
   alert(image);
 }
于 2012-10-03T08:10:58.503 に答える