通过ajax刷新后重新绑定jquery插件

Question

我有一个显示10条记录的网格。下一组记录是通过ajax请求加载的。每个记录都有一个名为Activate/Deactivate的按钮来切换活动状态。

此button与一个最初运行良好的jquery alerts插件绑定。但是，当下一组记录使用ajax请求加载时，该插件将无法工作。我必须每次都用按钮重新绑定插件。

这是我的代码：

function actionStatus() 
{
    $('.js-status').alerts({
        customClass: 'gmail',
        heading: 'Switching activity status..?',
        message: 'Are you sure.?<br><br>`Proceed` to continue<br>`Cancel` to exit',
        buttons: {
            ok: {
                text: 'Proceed',
                class: 'buttons green',
                click: function ($this, e) {
                    $this.next('form').submit();
                }
            },
            cancel: {
                text: 'Cancel',
                class: 'buttons lightRed',
                focus: true
            }
        }
    });
}

actionStatus();

ajax呼叫后：

$.ajax({
    ...
    complete: function() {
        ...

        actionStatus();
    }
})

有没有一种方法，我不必再次绑定插件。

Answer 1

免责声明：由于您说过您使用了自定义插件，但我不知道如何绑定事件，因此，我将给出有关如何操作的一般性回答。

您可以绑定到document而不是接收事件的元素。

例如，代替：

$('.mybutton').on('click', callback);

仅附加到存在的元素上，您可以这样做：

$(document).on('click', '.mybutton', callback);

附加到文档本身，并且还监听来自将来的DOM元素的事件。