jQuery 对话框中的 javascript setInterval(） 在销毁或删除时不会停止

javascript setInterval() inside jQuery dialog not stopping on destroy or remove

本文关键字：删除 对话框 javascript setInterval jQuery      更新时间：2023-09-26

我有一个jQuery对话框出现并加载一个外部页面。在该页面中，我正在运行一个setInterval()函数，该函数每 1 秒连续查询一次我的服务器 （AJAX）。问题是当我关闭对话框时，setInterval 不会停止运行。

下面是对话框的代码：

var theUrl = 'someUrl';
var popUp = document.createElement('div');
$(popUp).dialog({
        width: 400,
        height: 270,
        title: "Some Title",
        autoOpen: true,
        resizable:false,
        close: function(ev, ui) {
                    $(this).dialog('destroy');
               },
        modal: true,
        open: function() { 
                    $(this).load(theUrl);
              }
});

我试着打电话给$(this).dialog('destroy')，$(this).remove()和document.body.removeChild(popUp)关闭。 什么都没用。 无论如何都可以"卸载"加载的页面吗？

setInterval返回一个处理程序，您可以将其传递给clearInterval以阻止函数运行。 以下是其工作原理的基本示例。

var handler = setInterval(function() {}, 2000);
clearInterval(handler);

对于您的示例，您希望在ui.dialog的 close 方法中调用 clearInterval。

文档：

setInterval - https://developer.mozilla.org/en/window.setInterval

clearInterval - https://developer.mozilla.org/en/DOM/window.clearInterval

编辑

如果没有来自setInterval的存储处理程序，您将无法调用clearInterval，因此，如果对setInterval的调用是在另一个脚本中，则捕获处理程序的唯一方法是覆盖window.setInterval本身。

$(function() {
    var originalSetInterval = window.setInterval;
    var handlers = [];
    window.setInterval = function() {
        handlers.push(arguments[0]);
        originalSetInterval(arguments);
    };
    $('whatever').dialog({
        close: function() {
            for (var i = 0; i < handlers.length; i++) {
                clearInterval(handlers[i]);
            }
            handlers = [];
        }
    });
});

请注意，要覆盖window.setInterval的代码必须先包含<script>标记以引入外部文件。 此外，此方法将在调用clearInterval时清除所有间隔函数，因此这并不理想，但这是完成此操作的唯一方法。

相关文章：