如果通过JQuery提供内容并且未对其进行硬编码，则div功能会出现问题

问题描述

|| 我的问题可能是从这个小提琴中最容易解释的：http://jsfiddle.net/L3zVY/7/ 如果您单击框右上方的图像，则框会消失（图像不存在，因此只是一个问号）。 如果我尝试动态地操作这些框而不是对其进行硬编码，则由于某种原因会丢失此功能。 我这样做的原因是因为我有一个登录页面，该页面使用一个根据错误消息更改类的框。一切正常，除了能够关闭盒子... 有任何想法吗？ 码：

$(document).ready(function() {
// Close notifications (fade and slideup)

        $(\".notification a.close\").click(function () {
            $(this).parent().fadeto(400,function () {
                $(this).slideUp(200);
            });
            return false;
        });


// JQuery broken Notification:
    $(\"#msgBox1\").html(\'broken :( <a href=\"#\" class=\"close\"><img src=\"images/notification_close.png\" alt=\"close\" /></a>\');

});

    

解决方法

        http://jsfiddle.net/L3zVY/8/您需要将live（）函数与jquery一起使用。     ,        当您分配

click

处理程序时，您插入的元素尚不存在，因此jQuery无法找到它。 要么先插入元素：

$(document).ready(function() {
    $(\"#msgbox1\").html(\'...\');
    $(\".notification a.close\").click(...);
});

或使用

.live()

/

.delegate()

：

$(document).ready(function() {
    $(\".notification\").delegate(\'a.close\',\'click\',function(){...});
    $(\"#msgbox1\").html(\'...\');
});

事件处理程序始终绑定到元素。您不能将任何东西绑定到不存在的东西上。

live

/

delegate

通过在DOM树上进一步绑定事件处理程序（由于事件冒泡而可能）并检查事件的目标来克服了此问题。