0

我正在开发一个完全基于 ajax 的 Web 应用程序。有两个主要部分。左侧面板有链接;单击任何链接时,右侧面板的内容会通过 ajax 动态加载。ajax 调用返回包含 html 和 javascript 的 json 编码响应。这是示例 page1.php 文件。

$output=array();

ob_start();
include("page1html.php");
$output['html']=ob_get_clean();

ob_start();
include("page1script.php"); //page1script.php return the page specific script
$output['script']=ob_get_clean();

echo json_encode($output);

这是示例 page1script.php

<script>
    ajaxscript = {   //namespace
        init: function () {
        },
        foo: function () {
        }
    };
</script>

其他页面的样式相同,但使用不同的 html 和不同的脚本。(这就是我没有创建全局 js 文件的原因,因为它会变成一个大文件。我只想加载特定于页面的 js)。

//this is onclick of link
updatecontents("page1.php");  ...
updatecontents("page2.php"); and so on

这是我的js

var xhr;
var ajaxscript = null;

function updatecontents(addrs) {
    if(xhr) xhr.abort();
    $('#mainpanel').html('<div class="loader"></div>');
    $('#ajscript').html('');
    ajaxscript = {};    //remove the previous functions in the namespace; This is where I cleanup the old functions

    xhr=$.ajax({
        url: addrs,
        dataType : 'json',
        success: function(response) {
            if(response.html)
                $('#mainpanel').html(response.html);
            if(response.script)
                $('#ajscript').html(response.script);

            if(typeof(ajaxscript.init)=='function') ajaxscript.init();
        },
        error: function () {}
    });
}

这是 II 可以达到的最好的结果......但我刚刚注意到 firefox firebug scripts 选项卡中的列表不断增长:在 js//eval/seq/ 下,每次单击链接时都会增长。这让我觉得每次单击链接时脚本都会加载到内存中,并且它们会保留在浏览器缓存中。如果我走在正确的道路上,我想获得一些专家意见……或者我需要什么优化。

4

2 回答 2

0

使用 .load 而不是 .ajax 来加载内容是一个很好的解决方案。数据将缓存在浏览器中。但是,当结果(包括 html 和 js)很大时,可能 js 内容会阻塞 html 内容。所以我的建议是,为什么不在 PHP 中将 js 内容写入文件,只返回该 js 文件的 URL。

于 2013-03-29T06:27:01.393 回答
0

我有几乎同样的问题。对我来说,刷新 div 时无法导航链接。有。我认为您必须在 ajax-success 中使用 .load 而不是 html

于 2013-03-29T06:03:00.253 回答