0

当用户单击 twitter 引导模式窗口按钮上的确认按钮时，我正在页面上执行删除操作。

我有两个按钮：一个允许用户取消操作，另一个用于确认。

当用户单击确认删除按钮时，当模式被隐藏时，我执行我的操作，例如我可以显示动画并实际删除项目。

如果用户点击了几个项目，但他/她的选择是取消按钮，当他/她点击他/她想要删除的项目时，也会对选择取消的元素执行删除。

一旦执行，“隐藏”事件是否应该与元素分离？

我知道我可以将事件链接更改$('#confirmDeleteModal').on('hidden', function() {为分离，$('#confirmDeleteModal').off('hidden').on('hidden', function() {但我真的会理解为什么会发生这种情况。我错过了什么吗？

代码是：

$(document).ready(function(){
    $('.delete').on('click', function() {
        var itemID = $(this).data('product-id')

        $('#confirmDeleteModal').modal('show');

        $('#confirmDelete').on('click', function() {

            $('#confirmDeleteModal').on('hidden', function() {
                // Here I do my stuff to perform deletion
                $('#result').append('This method has been called for ' + itemID + ' <br />' )
            });
        });
    });
});

我希望我已经清楚地暴露了我的问题。我也准备了一个 JS Bin：http: //jsbin.com/inulaw/5/edit

4

1 回答 1

1

这里的问题是您每次都将额外的侦听器附加到clickand事件。hidden要解决此问题，请在再次调用之前链接 jQuery.off('eventName')方法.on('eventname')。

这是您的代码更新并在 JS Bin 中运行良好：

$(document).ready(function(){
    $('.delete').on('click', function() {
        var itemID = $(this).data('product-id')

        $('#confirmDeleteModal').modal('show');

        $('#confirmDeleteModal').off('hidden'); // must reset from previous
        $('#confirmDelete').off('click').on('click', function() {

            $('#confirmDeleteModal').on('hidden', function() {

                    // Here I do my stuff to perform deletion
                    $('#result').append('This method has been called for ' + itemID + ' <br />' )
            });
        });
    });
});

编辑：我将$('#confirmDeleteModal').off('hidden');点击事件移至上方，因此它会重置是否点击确认。

于 2013-04-30T02:30:30.440 回答