内部克隆的 div 绑定操作与 jquery

Question

我的索引页有一些记录，其中每条记录都有一个或多个与之关联的图像。

在记录描述下，有图像拇指列表。 我在其中将onclick事件绑定到js函数，该函数在div showImage内以不同的高度克隆该图像。

没事。

现在我需要使用灯箱以全屏模式在 showImagediv id 中打开该克隆图像。这是我现在拥有的代码(它可以工作但没有全屏实现(

<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.net mvc3，但我认为这在这里并不重要。例如，您可以使用html和css向我展示。谢谢

更新：为简单起见，我想在单击时绑定到showImagediv中的克隆图像的操作可以是警报消息。

Answer 1

您希望在

DOM之后创建的元素上进行Event click，在这种情况下，您希望使用：

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

在这里，您可以获得更多信息。

Answer 2

以下解决方案是成功的。 完成了我的taks。我必须在渲染元素后绑定单击事件，因此我使用以下方法实现了这一点：

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

.live 将在窗口上添加一个事件处理程序并检查 click 事件，然后检查目标，如果它与触发的事件匹配。

这样，在 DOM 上随时添加的任何元素都将触发此处理程序。

非常感谢@Seb为我指明正确方向的人。