Question

在我的List.cshtml中，我在模型上有一个剃刀foreach。

在文档中。我已经这样做了：

$(document).on('click', '#deleteCustomer', function(e){  
                e.preventDefault();

            // Make ajax call to database and delete the custmer

            // if success delete the customer tr-tag also from the UI

});

当我的List.cshtml foreach表最初为空并且我在运行时3期间添加了对tbody-tag表示3个tr-tags的客户时，似乎每个行都会注册点击。这一方面很糟糕，因为当我点击删除按钮时，事件会被触发3次。

当我使用此代码时：

$(document).one('click', '#deleteCustomer', function(e){  
                e.preventDefault();

            // Make ajax call to database and delete the custmer

            // if success delete the customer tr-tag also from the UI

});

然后我只能删除一次客户。当我点击customer1和customer2的其他删除按钮时，事件不会被触发。

使用.click是不够的，因为我的元素是在运行时添加的。

    $('#deleteCustomer').click(function (e) {

我如何订阅一个html表，其中每一行都有一个删除按钮，所以我没有为一次点击或一次事件触发多个事件而其他按钮不再起作用了？

1。）正确的订阅/取消订阅是什么？

2。）我是否还应该在桌面行的每个按钮上更好地使用.deleteCustomer？这是否也会导致问题？

更新

好吧，这比我想象的复杂得多，我知道问题的原因：

我有一个带节点的树。每个树节点都显示一个客户表及其行+每个按钮。

当我点击node1之类的不同节点时，customers1将显示在#customersDiv中当我单击另一个node2来显示customers2时，也会显示在#customersDiv

中

这意味着我有两张桌子放在另一张桌子上。当我在运行时添加Node1和Node2的客户时，注册的点击次数太多......这意味着在我输入客户VIEW之前，我需要取消订阅点击事件的所有现有订阅吗？

好的，我刚刚发现当我重新加载同一个节点并创建一个新客户时，在删除它之后，该事件被多次触发。

我试过在document.ready：

之后这样做

  $(document).off('click', '.deleteTeststep',function() {

            });

因此，每次我点击一个节点时，所有以前的嫌疑人都会被删除......但这没有帮助：/

Answer 1

这样的事情怎么样？

<div class='delete'>entry 1<button>delete</button></div>
<div class='delete'>entry 2<button>delete</button></div>

$(document).on('click', 'button', function () { 
    console.log('... do some work ...');
    $(this).prop('disabled', true);
});

Fiddle

Answer 2

看起来你正在asp循环的每次迭代上执行事件绑定。您应该将该javascript移动到外部.js文件，并将其包含在<head></head>部分或页面的结束</body>标记之前。这将导致js只执行一次，这样每次点击只执行一次。

如何应用jquery .on / .off并使用带有每个数据行按钮的html表单击事件

2 个答案: