Question

这非常令人尴尬我甚至无法想到从哪里开始。

我有很多表格行，看起来像这样。如何创建一些允许单击x的jQuery，从而从DOM中删除输入行。

我当然可以将一些标签硬编码到代码中并使其适用于这种特定情况，但是我希望它适用于任意数量的类似行。这是我的大脑暂时失败的地方。

<tr><td>Well Name - <span class="urlOfProperty">http://mycompany.com/type/well-name</span>
  <div class="close">[<a href="#">x</a>]</div></td>
</tr>

Answer 1

你可以在jquery中使用.closest方法：

$(".close a").on("click", function(e) {
    $(this).closest("tr").remove();
    e.preventDefault();
});

（或使用代表，可能更适合您的特定任务）：

$("table").on("click", ".close a", function(e) {
    $(this).closest("tr").remove();
    e.preventDefault();
});

代码示例适用于jQuery 1.7 +

如果您使用的是较低版本，可以使用：

$("table").delegate(".close a", "click", function(e) {
    $(this).closest("tr").remove();
    e.preventDefault();
});

有点警告，这会将事件绑定在文档中的所有表上，更改表选择器可能会更加独特。

Answer 2

在您的桌面上添加“my_table”ID并使用以下内容：

$(function(){
    $("#my_table").on('click','.close',function(event){
        event.preventDefault();
        $(this).closest('tr').remove();
    });
});

当我点击<a></a>时，如何使用jQuery / JS使enter行（）消失

2 个答案: