Question

我不清楚如何删除由ajax成功函数添加的类。我有这段代码：

$.ajax({
    dataType: "json",
    [...]
    success:function(data) {
        for (var i = 0; i < data.length; i++) {
            $('[name="'+data[i]+'"]').addClass('tmvc_err');
        }
    },
});

它基本上为那些没有通过我的php验证脚本的字段添加了红色边框。现在，我试着在更改事件后删除该红色边框（或更好，尝试删除类.tmvc_err）。这不起作用：

$(".tmvc_err").on('change', function() {
    $(this).removeClass('tmvc_err');
});

它已准备就绪，所以我猜问题是，在文档准备就绪后，由ajax添加类，它找不到该类。那么，我怎么解雇呢？

Answer 1

动态添加元素需要event delegation

$(document).on('change', ".tmvc_err", function() {
    $(this).removeClass('tmvc_err');
});

委派活动

委派事件的优势在于它们可以处理来自的事件稍后添加到文档中的后代元素。通过选择一个保证在当时存在的元素委托事件处理程序附加，您可以使用委托事件避免经常附加和删除事件处理程序，jQuery docs

Answer 2

尝试在此处使用 event delegation ，因为您的课程已动态添加：

事件委托允许我们将单个事件监听器附加到父元素，将为匹配选择器的所有子项触发，这些孩子现在是否存在，或将来是否存在。

$("body").on('change','.tmvc_err', function() {
    $(this).removeClass('tmvc_err');
});

Answer 3

如果动态添加，则需要事件委派 -

$(document.body).on('change','.tmvc_err', function() {
    $(this).removeClass('tmvc_err');
});

jQuery：删除由ajax成功添加的类

3 个答案: