Question

我有一个动态创建的列表，我想在删除按钮上为其所有元素添加一个点击事件。

每次我向列表中添加一个元素时，我都会向所有列表元素添加一个事件，但是对于旧元素，事件会叠加而不是被替换，因为我多次运行该事件：

function(e) {
                    $(".tr-del").on('click',
                            function(e) {
                                alert("delete");
                                $(this).parent().fadeOut("fast");
                            });

结果是，对于旧元素，您需要多次按下删除按钮。

即使多次运行事件关联，如何只能有一个事件。我不知道何时添加姓氏，所以我需要多次运行。

工作代码在这里：我做了JSFiddle 来展示/测试这种情况。

Answer 1

将Click事件多次添加到元素中。如果您只想附加一次事件，请在添加off('click')之前添加on('click')。这将删除现有的点击事件并添加一个新事件。

   $(".tr-del").off('click').on('click',
                    function(e) {
                        alert("delete");
                        $(this).parent().fadeOut("fast");
                    });

我还更新了JSFIDDLE

Answer 2

试试这个..这应该可以解决你的问题.. 只需添加它添加点击功能的结束

li.find(".tr-del").on('click',
function(e) {
    alert("delete");
    $(this).parent().fadeOut("fast");
});

Answer 3

 $("#yourIdAttribute").off('click').on('click', function(e) {
     alert("delete"); // Or do something !!
     $(this).parent().fadeOut("fast"); //This is to disappear the tag with #yourIdAttribute
 });

*因此使用off（'click'）然后再on（'click'）是防止事件堆积的最佳选择！每次超过函数$（）。on（'click'，function（e）{}）或$（）。click（function（e）{}）时，都会在该标签中堆叠1个新事件e =“ yourIdAttribute”>。首次单击时，它将调用1次，然后单击，将其调用2，然后再调用3，以此类推！

多次分配时如何防止事件堆积？

3 个答案: