0

我有这个代码：

function loadPage(page, link) {
            if ($('div#content').attr('current') != page) {
                $('div#content').load(page, '', function (responseText, textStatus, XMLHttpRequest) {
                    if (textStatus == 'error') {
                        $('div#content').html("<?php include 'error/404.php' ?>");  
                    };
                });
                var html = $('div#content').html();
                if (html != "<?php include 'error/404.php' ?>") {
                    $('div#content').hide().fadeIn('slow').attr('current', page);
                };
                $('div#header div#bottom div#nav ul#main li a').removeClass('active');
                $(link).addClass('active');
            };
        };

我不明白为什么当它将 div 中的 html（刚刚放入 div#content 的来自 'error/404.php' 的 HTML）与源 html（error/404.php）进行比较时，它不是一样的，不遵循真正的道路。

有帮助吗？

4

2 回答 2

2

这里一定有一些混淆，这一行：

$('div#content').html("<?php include 'error/404.php' ?>");

很可能不是你想做的。此时您在浏览器中，您无法访问后端，就像您在生成响应时返回时一样。这只会将文字 html 字符串插入到div#content元素中，它无法error/404.php从 javascript 领域运行您的脚本。

您可能想要做的是向将运行的服务器发出一个新请求error/404.php并将其输出返回给 javascript 调用，以便您可以将其插入到文档中。这个一般想法称为 AJAX，对于您的特殊情况，您可以使用 jQuery 的.load()方法来执行此操作：

$('div#content').load('http://insert-full-url-here.com/error/4o4.php');

更新：

另一个问题是.load()您比较的异步性。Javascript 是一个单线程环境，所以当你请求某些东西被.load()编辑时，它不会等待它完成，只是运行低谷，当响应返回时启动回调。您的第一次加载看起来像这样：

$('div#content').load(page, '', ....

当它下面的条件时，不会结束和修改 dom 树：

if (html != "<?php include 'error/404.php' ?>")

运行。

当负载确实返回时，您将需要执行该部分代码。.load()您可以将 slideDown 条件直接移动到回调中，而无需比较奇怪的字符串：

$('div#content').load(page, '', function (responseText, textStatus, XMLHttpRequest) {
    if (textStatus != 'error') { // flipped the condition to NOT error
        $('div#content').hide().fadeIn('slow').attr('current', page); // do the part of the second test
    };
});

我不确定其余两行是否应该在加载之后或之前运行。如果它们需要在没有错误发生时运行，请将其放在 div 中，如果它们需要运行，无论错误但在加载后将它们放在.load()的回调中。

较新的 jQuery 从 ajax 相关调用返回基于 commonjs 承诺的 jqxhr 对象，因此语法可能如下所示：

$.get(page).done(function(resp){ // the .done() is called when there were no error
    $('div#content').html(resp);
    // anything you want to run on content get success
});
于 2012-08-08T20:18:16.777 回答
0

我不能仅通过查看您的代码来准确判断，但这是一条走出困境的道路：

    function loadPage(page, link) {
        if ($('div#content').attr('current') != page) {
            $('div#content').load(page, '', function (responseText, textStatus, XMLHttpRequest) {
                if (textStatus == 'error') {
                    $('div#content').html("<?php include 'error/404.php' ?>");  
                };
            });
            var html = $('div#content').html();

            console.log(html); //Check the Value of html right before it is 
                               //compared. You might be surprised to see something 
                               //like 'undefined' or 'null' as the value. This 
                               //means html is comparing correctly, but is not 
                               //being instantiated properly.

            if (html != "<?php include 'error/404.php' ?>") {
                $('div#content').hide().fadeIn('slow').attr('current', page);
            };
            $('div#header div#bottom div#nav ul#main li a').removeClass('active');
            $(link).addClass('active');
        };
    };
于 2012-08-08T20:17:42.323 回答