0

私のインデックスページにはいくつかのレコードがあり、各レコードには1つ以上の画像が関連付けられています。

レコードの説明の下に、画像の親指のリストがあります。ここで、divshowImage内の異なる高さでその画像を複製するjs関数にバインドされたonclickイベントがあります。

それはすべて大丈夫です。

次に、ライトボックスを使用して、showImagedivid内のクローン画像をフルスクリーンモードで開く必要があります。これが私が今持っているコードです（それは動作しますが、フルスクリーン実装なしで）

<script type="text/javascript">
    function onPopUp() {
        var imageObject = $("img.details").first();
        var clonedObj = $(imageObject).clone();
        clonedObj.height("250px").width("300px");
        clonedObj.appendTo($("div#showImage"));

        $(".details").click(function (event) {
            //clone the clicked image
            var clone = $(this).clone();
            clone.height("250px").width("300px");
            //place it in the placeholder
            $('div#showImage').html(clone);
        });
    }

バックエンドコードはasp.netmvc3ですが、ここでは重要ではないと思います。たとえば、htmlとcssを使用して表示できます。ありがとう

更新：簡単にするために、onclickをshowImagediv内の複製された画像にバインドするアクションをアラートメッセージにすることができます。

4

2 に答える 2

1

Event clickの後に作成された要素を使用したいDOM場合、この場合は次を使用します。

$('#cloned').bind('click', function() {
  alert('User clicked on "cloned element."');
});

ここに詳細があります。

于 2012-05-22T16:14:59.023 に答える
0

次の解決策は成功です。私のタックを完了しました。要素がレンダリングされた後にのみクリックイベントをバインドする必要があるため、次を使用してこれを達成しました。

$("#showImage").live("click", function (event) {
    alert('User clicked on "cloned element."');
});

.liveは、ウィンドウにイベントハンドラーを追加し、クリックイベントをチェックします。次に、ターゲットがトリガーされたイベントと一致する場合は、ターゲットをチェックします。

このように、DOMにいつでも追加された要素は、このハンドラーをトリガーします。

私を正しい方向に向けてくれた@Sebに感謝します。

于 2012-05-22T18:08:47.347 に答える