Javascript弹出窗口不'；不要在下一页分页

我使用PHP和Javascript构建了一个类似项目的数据视图。在我的页面上，通过分页，它有一个用户表。每行都有删除按钮。当我点击第一页上的那个按钮时，它工作正常。当我在下一页的每一行单击“删除”按钮时，弹出窗口似乎停止工作了。下面是我的代码：

用于运行弹出窗口的Javascript：

$（.mb控件”）。在（“单击”，函数（）{
变量框=$（$（this）.data（“框”）；
如果（长方体长度>0）{
框。切换类别（“打开”）；
var声音=盒数据（“声音”）；
如果（声音==‘警报’）
播放音频（“警报”）；
如果（声音=='fail'）
播放音频（“失败”）；
}        
返回false；
});
$（“.mb控件关闭”）。打开（“单击”，函数（）{
$（this.parents（“.messagebox”）.removeClass（“open”）；
返回false；
});    尝试在动态创建的元素上绑定click事件，如下所示，因为类名为mb控件的第二页按钮在DOM上不存在，因此该事件仅附加到现有元素

希望对你有帮助

 $("body").on("click",".mb-control-close",function(){
       $(this).parents(".message-box").removeClass("open");
       return false;
    });

$("body").on("click",".mb-control",function(){
        var box = $($(this).data("box"));
        if(box.length > 0){
            box.toggleClass("open");

            var sound = box.data("sound");

            if(sound === 'alert')
                playAudio('alert');

            if(sound === 'fail')
                playAudio('fail');

        }        
        return false;
    });

我认为包含按钮的分页行无法绑定到click事件，因为它们是动态创建的：

试试这个：

$(document).on('click','.mb-control-close', function (event) {
        $(this).parents(".message-box").removeClass("open");
           return false;
    });

对于动态内容上的事件绑定，不应使用直接事件，而应使用委派事件。看一看
 更改
var-box=$（$（this）.data（“box”）到
var框=$（此）.data（“框”）相同。还是不行，还是不行。顺便说一下，对于分页，我使用DataTables.net1.10.9版的DataTables再次进行分页，但仍然相同。顺便说一下，当我将Javascript放在同一文件中时，它将在下一页工作，但在第一页不工作。当我把Javascript放在另一个文件上时，第一页正常工作，但下一页停止工作。当我将Javascript放在duo页面（同一个文件和其他文件）上时，第一页上的弹出窗口停止工作。我不知道该怎么办。@KhalilIsmail检查您的控制台当您单击秒页面上的“删除”按钮时会显示什么？谢谢，在我清除浏览器上的缓存后，看起来它现在可以用你的代码工作了。@Khallismail检查我在答案中发布的链接，然后做一个
alert
，看看你是否可以提醒或not@KhalilIsmail始终使用ctlr+F5重新加载浏览器页面。它将加载新副本。