2

我使用jQuery和history.js来管理部分页面之间的动态转换；这样我就可以避免重新加载整个文档。其中一些部分页面调用它们自己独特的javascript文件。虽然页面之间的转换运行良好，但在调用它的部分页面被动态替换后，执行的javascript的残余仍然保持活动状态。

如何卸载通过动态页面加载引入的javascript，然后异步替换为另一个页面？


更精细的细节

主模板

我的主模板（用于所有页面）可以被认为是一个简单的：

<html>
<head>
<script>
    //scripts to manage asynchronous loading of partial-pages into #content div
</script>
</head>
<body>
    <div id="content"></div>
</body>
</html>

用户资料

在#content div中呈现的一个部分页面用于用户的Profile：

<script src="profile.js"></script>
<form>
    <input type="file" name="profile-picture">
</form>

profile.js的内容类似于：

$(function() {
    $('input').change(function() {
        // upload profile picture asynchronously
    });
});

用户设置

在主模板的#content div 中加载的另一个部分页面是用户的Settings：

<script src="settings.js"></script>
<form>
    <input type="text" name="first-name">
    <input type="text" name="last-name">
</form>

settings.js的内容类似于：

$(function() {
    setInterval(function() {
        // auto-submit form every 10 seconds
        $('form').submit();
    }, 10000);
}
});

问题

  • 在调用它们的部分页面被另一个替换后，某些javascript函数会继续运行（例如setInterval ）。
  • 这种为每个部分页面加载新javascript的业务感觉很混乱；但对于我的生活，我找不到任何关于最佳实践的建议。

在允许每个部分页面的页面特定脚本的同时，实现动态部分页面加载/卸载效果的更好方法是什么？

谢谢！

4

2 回答 2

1

首先......一旦你加载了javascript......你不能卸载它

该setInterval问题将需要使用clearInterval

声明一些深奥的名称，使其在初始化时作为全局变量相当独特确保在使用之前setiIterval;声明var外部$(document).ready

var my_super_form_submitter

$(document.ready)function(){...
 my_super_form_submitter=setInterval(func.....

然后每当您加载新页面时

if(my_super_form_submitter)
clearInterval(my_super_form_submitter)

至于与其他方法的冲突......您可以为您的页面特定代码采用内容类协议。在每个页面加载时，更改内容 div 的类...然后在 jQuery 选择器中使用该类

于 2013-11-01T01:04:41.490 回答
0

对于第一个问题：

问题是更换软件包后哪些功能继续运行。您提到的 SetInterval 使用 js 计时器，并且简单地替换包不会自动停止计时器。您应该在替换之前清除所有通过 setInterval 启动的计时器。

例如

$(function() {
    var timer = setInterval(function() {
        // auto-submit form every 10 seconds
        $('form').submit();
    }, 10000);
}

function uninitialize(){
    clearInterval(timer);
}

只需在替换包之前调用 uninitialize ，它应该可以工作。

不幸的是，我不知道加载部分页面的任何正确方法，但我希望它能以某种方式帮助你（：

于 2013-11-01T00:59:44.277 回答