.parent().remove() 问题

Posted 2023-02-22

【中文标题】.parent().remove() 问题

【英文标题】：.parent().remove() issue

【发布时间】：2011-08-25 23:58:54

【问题描述】：

我有一个基于 jQuery 的表单，您可以在其中向应用程序添加额外的人员。我正在克隆第一个字段集并将其添加到最后最多 3 人。当您添加了 1 个额外的人时，您可以选择删除该人。

但是，我的删除按钮不起作用。之前是这样，直到我在克隆中添加了额外的函数来更改字段集中其他元素的 ID。

我正在使用：

$(".remove").click(function() 
    $(this).parent().remove();

原来可以，但现在不行，我不知道为什么。

我删除了阻止第一个“删除此人”的行，只是为了表明第一个仍然有效，但其余的无效。 （当它修复后，我最终会将第一个放置在舞台外）

可能更容易看到所以我把它贴在here。

所以本质上，任何想法为什么我的“删除此人”除了第一部分之外没有处理所有问题？

【参考方案1】：

元素原本不存在，也就是说你需要使用.live()或者.delegate()

例如，改变：

使用$(".remove").click(...) 而不是$(".remove").live("click", ...) 这个

【参考方案2】：

您可以这样做来删除父级：

 $(document).on("click", ".remove", function()  
      $(this).parent().remove(); 
 );

或者您可以这样做以删除所有父母：

 $(document).on("click", ".remove", function()  
      $(this).parents().remove();
 );

【参考方案3】：

试试：

$(document).on('click', '.remove', function() 
    $(this).parent().remove();
);

事件在页面加载时绑定，因此新添加的元素没有。

【讨论】：

这很可能会起作用，如果是这样，原因是当您执行 $.click() 时，您会将事件处理程序连接到与选择器匹配的所有 当前存在的元素，而$.live() 将它连接到所有 当前或未来 匹配元素。如果在代码连接事件处理程序运行后添加新人块，则在处理程序连接时它们不存在，因此不包含在选择器中当事情发生时 .

@Tomas：实际上.live() 没有连接到任何匹配选择器的元素。它为window 或document（我不记得是哪一个）提供了一个处理程序，并使用文档范围的事件委托。出于这个原因，我更喜欢使用.delegate()，它也使用委托，但仅限于您定义的容器内。

@patrick：你是对的。性能方面最好使用委托。虽然委托也在内部使用 live（带有额外参数）。

是的，你是对的。因为他们在做同样的事情，jQuery 将所有功能整合到一个方法中。我认为如果他们只指定一种公共委托方法会更好。

【参考方案4】：

“实时”函数调用已被弃用，不再有效。您可以在此处找到有关如何使用替换 'on()' 方法重写函数的说明以及有关弃用的更多信息：

http://api.jquery.com/live/

要处理所有当前和新创建的元素，您现在必须使用：

$(document).on("click", ".remove", function() 
    $(this).parent().remove();
);

jQuery 在文档对象上运行，而不是在元素上运行，并且有一个额外的参数来指定要监视哪些元素并添加事件侦听器。

【参考方案5】：

确保关闭你的表达式：

$(".remove").click(function() 
    $(this).parent().remove();
);

【讨论】：

太棒了！非常感谢你！真的很感激！我使用了$(".remove").live("click",function() $(this).parent().remove(); reset(); ); ，它成功了！再次感谢！太棒了！