Question

美好的一天，我正在开发一个项目，我使用jQuery将页面加载到div中，每个页面都有自己的jQuery脚本，我的问题是先前加载的脚本没有从DOM中清除，这会产生更大的问题对于我的项目。

例如，我在一个页面中有一组定时器，它会自动保存数据，但是当我更改页面时，定时器仍在运行并弄乱了内容。

我管理更改这样的页面：

$(document).ready(function() {

   $('li').click(function (event) {

      $('.progressbarone').hide();
      var theitem = this.id;
      //isf ajax to load with addon
      var thefile = "isf_ajax.php?addon="+this.id;
      var progress = '<span class="progressbarone"><img src="'
         + THEMEURL
         + '/gfx/images/progessbar1.gif" width="20" height="16" /></span>';

      // pre actions
      $('.'+ theitem +'_item')
         .append(progress)
         .children(':last')
         .hide()
         .fadeIn(1000);
      $('li').removeClass('active');
      $(this).addClass('active');

      // load the page
      $('#childpage').remove();
      $('#officetable').html('<div id="childpage">loading</div>');
      $('#childpage').load(thefile, function() {

         // after load actions
         $('.progressbarone').fadeOut(2000);
      });
   });
});

正如您所看到的，我有两个div，一个称为office表，用于处理子页面，childpage具有已更改页面的内容。但是你可以看到我使用了remove（）;功能以及之后，我将子页面放置在officetable并发布文件的内容，但它仍然不会删除我以前加载的脚本。

谢谢你们。

Answer 1

将脚本附加到页面后，即可运行这些脚本。虽然从DOM中删除脚本标记，但变量仍将保留。我的意思是定时器，函数，代码中声明的任何变量。

所以你可能想要清除以前不再需要的状态。

function doTheCleanup(){
    clearTimeout(globalTimerVariable);
    delete someGloablVar;
    //and so on
}

Answer 2

如果您的脚本已经执行了删除DOM元素，则不会删除它们。使用JavaScript转到任何页面，打开firebug或console并输入$（“script”）。remove（）。一切都在继续。

以下是一些提示：

不要在每次ajax调用时重新包含脚本。
如果你有需要处理的事件使用jQuery.live（）
只设置任何定时器一次，而不是每次ajax通话。

听起来您正在构建单页网页应用，您可能希望使用类似backbone.js的内容来组织代码并帮助您遵循更好的模式。看看这个教程：

http://addyosmani.com/blog/building-spas-jquerys-best-friends/

祝你好运

Answer 3

也许你删除了进度条跨度？另外，您可以考虑使用$ .deferred - ＆gt; .done

jQuery clear DOM以前加载的脚本

3 个答案: