JQuery 可重用函数答案

【问题标题】：JQuery reusable functionsJQuery 可重用函数
【发布时间】：2010-10-21 00:44:15
【问题描述】：

对 JQuery 完全陌生，所以我每天都在学习。

我注意到它是多么容易，你可以写

$('div#test).remove();

但我正在寻找有关如何重用某些代码的示例，例如：

function RemoveTableRow(row, id) 
{
   $(row).remove();
   // id should be used for ajax call
}

然后在我的锚标签上添加一个“onclick”

onclick="RemoveTableRow('user-row-1', 32);"

但不知何故它不起作用，即使我将它添加到 document.ready 函数中。有人可以帮我剪一下吗，这样做的最佳实践方式？

提前致谢。这个论坛是杀手！

更新

我从这里获得的帮助中更新了代码。这是我当前的代码，我想知道它是否是最好的方法。

function RemoveTableRow(row, id) {
            $.ajax({
             type: "POST",
             url: "Default.aspx/DeleteEmployee",
             data: "{'ID':'" + id + "'}",
             beforeSend: function() {
                  $("#" + row).animate({'backgroundColor':'#fb6c6c'},300);
             },
             success: function() {
              $("#" + row).slideUp(300,function() {
                    $("#" + row).remove();
              });
             }
        });
    }

【问题讨论】：

您是否遇到任何 JavaScript 错误？
您编辑的代码看起来很好，看起来是最好的方法。我不会改变它。

标签： jquery function row reusability

【解决方案1】：

user-row-1 是表格行的 ID 吗？如果是，那么您的选择器中缺少#

function RemoveTableRow(row, id) {
   $('#'+row).remove();
   // id should be used for ajax call
}

或者不改变函数，用完整的选择器调用它

onclick="RemoveTableRow('#user-row-1', 32);"

【讨论】：

当然！这行得通！这是最好的方法吗？或者你有什么推荐的吗？
这不是一个坏方法，但您可以使用更多的 jQuery 功能。例如，如果您在每一行都有一个删除按钮（只需阅读您对 kgiannakakis 答案的评论）（），您可以绑定点击这些删除按钮的事件侦听器，并找到该按钮的父 TR 元素。 $('.deleteButtons').click(function(e){$(this).parent().parent().remove()}) 或 $('.deleteButtons').click(function(e){$ (this).parents('tr').eq(0).remove()}) 这应该可以工作
太好了。但是我需要通过点击传递一些参数？
在这种情况下，我不清楚，但如果你能解释一下，你是如何使用这些参数的，这些数字是什么意思，也许我可以提供一个替代解决方案。请发布更多代码（RemoveTableRow 函数的其余部分）
对不起，没有找到更好的解决方案，所以我的第一个答案将是最终的

【解决方案2】：

您要将 onclick 绑定到哪里？假设它是一个 id 为 myid 的 DOM 元素，那么这样做：

("#myid").click(function () {RemoveTableRow('user-row-1', 32);} );

【讨论】：

我有一些表格行，每个行的末尾都有一个删除按钮，其中输出来自动态代码，所以我需要某种方式避免点击硬编码的 ID。