如何使用Ajax将页面带入我的站点,然后等待它完全加载脚本和所有

时间:2011-12-06 22:36:27

标签: javascript ajax jquery

我有一个将页面拉入动态界面的站点。目前,主页面要求任何javascript外部页面都需要加载主页面。外部页面的大多数javascript是在页面被拉入时构建的对象,但首先会导致问题。

由于某种原因,我有点难以解释,所以这里只是简单的过程。

1.请求提取页面

2.基于传递给函数的变量创建一个特定对象,该对象将与来自页面的物理html相关联(这是外部Javascript)

3.将页面加载到对象框架

此流程要求将外部javascript附加到主页面,而不是附加到的页面。

我想切换第2步和第3步,但我认为在尝试创建指定对象之前我需要一种方法来知道页面及其所有脚本已完全加载,但我不知道如何做到这一点。

我正在使用jQuery,并希望这可以在没有插件的情况下完成,但如果需要,那就这样吧。

由于

更新

好问题。因此页面是我们此时构建的本地页面,因此我们知道会发生什么。页面也被加载到基本的div结构中。

具体来说,主页面请求获取页面。该页面以字符串的形式返回,然后粘贴到主页面上的div元素中。我想这些页面更像是片段。但它们的范围可能相当复杂,需要一些javascript才能完全不使用任何javascript。

外部JavaScript通常会通过脚本标记添加,而不是内联。

由于页面的动态特性,我们不使用IFRAME,因此会导致模块移动出现问题。

2 个答案:

答案 0 :(得分:1)

如果你正在使用iframe,那么我想你正在改变它的src属性。要获得关于何时完成iframe加载的提醒,您应该在iframe的页面上包含一个脚本:

<script>
    $(window).load(function() {
        alert("All Done");
    });
</script>

如果您只是通过AJAX请求页面的字符串版本并填充div,则需要一些额外的JavaScript来检测这些动态加载的脚本文件何时完成下载到客户端。

我会访问此link以帮助您入门。

答案 1 :(得分:0)

Nick和Mic的解决方案的组合。

在您的IFRAME页面中,您需要一种方法来确定内容何时完成加载或准备,然后提醒您的主页:

<script>
    $(function() {
        parent.frameReady();
    });
</script>

在您的主页面中,您可以在IFRAME的钩子中进行编码:

<script>
    function frameReady() {
        // attach custom js to iframe here
    }
</script>