无法使用JavaScript创建的fadeOut元素

Question

我试图让圆角矩形在点击时淡出...任何人都知道它为什么不起作用？如果你去小提琴，请点击＆＃34; +＆＃34;图标，输入十六进制代码，然后使用＆＃34; x＆＃34;退出在右上角，尝试点击带有颜色的圆角矩形，它不会淡出。该元素显然是用js创建的。

http://jsfiddle.net/DmYny/1/

这是不想工作的代码::

$('.color').on('click', function(){
            $(this).fadeOut(300);
        });

Answer 1

您的单击处理程序适用于运行jQuery函数时存在的所有匹配元素。如果在此之后使用.color类创建一个新框，则它将不会应用处理程序。

试试这个：

$('body').on('click','.color', function(){
        $(this).fadeOut(300);
    });

将从body元素委派处理程序。这不是委派的最佳地点 - 您可能希望从一些容器委托更接近受影响的元素。