调试AJAX + Jquery网页 - 动态加载内容似乎无法正常工作

时间:2012-02-27 17:17:46

标签: jquery ajax web

我在我的新网站上使用jquery和Ajax函数时发现了一个可能的错误,或者更可能是我的代码上的一些大错误让我发疯。

这是进一步文档的网站网址, http://phpschool.altervista.org/is/

当我调用函数loadXML以这种方式使用ajax加载某些内容时会出现问题:

      $("#menubar .button").live("click",function () {

           $("#aj_load").fadeOut("slow", function()
           {                
              loadXML('archive/'+$(this).attr("id")+'.html');
           });

      });

// #menubar .button is the identifier for the menu buttons.
// #aj_load is the div that contains ajax contents when requested. 

所以这段代码的含义应该是

Fade out the contenitor aj_load,
Load Contents using ajax,
Show out the contenitor with contents,

但是,当我这样做时,ajax请求报告错误404或12000,并且脚本停止运行。

如果您尝试在网站上单击“关于”按钮,您应该看到它正常工作,因为我修改了代码以便从竞争者中删除fadeOut函数:

        $("#menubar .button").live("click",function () {

            loadXML('archive/'+$(this).attr("id")+'.html');
        });

为什么淡入淡出函数应该干扰ajax请求? 我无法解释这一点。

loadXML包含来自jquery的.load()函数,你可以在网站上看到它。

非常感谢,

编辑:

function loadXML(xmlURL)
{
resetStyles();

$("#aj_load").load(xmlURL+" #content0"+cur_seq, function(response, status, xhr) {
    if (status == "error") 
    {
        var msg = "Pagina Non Trovata: ";
        $("#aj_load").html('<br/><br/><br/><h3 style="text-align:center">'+msg + xhr.status + " " + xhr.statusText+'</h3>');
    }
    else
    {
        num_seq = $("#aj_content").text();
        if(num_seq !="0")
        {
            $("#less").off("click").on("click", function()
            { 
                $("#aj_load").fadeOut("slow",function()
                {
                    slideUP(num_seq);
                    loadNEXT(xmlURL,"prev");
                });
            });
            $("#more").off("click").on("click", function()
            {
                $("#aj_load").fadeOut("slow",function() 
                {
                    slideDW(num_seq);
                    loadNEXT(xmlURL,"next");
                });

            }).fadeIn("slow");
        }

    }
}).delay(300).fadeIn("slow",function(){inAnimation();});
}

1 个答案:

答案 0 :(得分:1)

这是因为当你使用$(this)来获取按钮ID时,你实际上正在获得你正在褪色的元素的ID。试试这个......

$("#menubar .button").live("click",function () {
    var buttonID = $(this).attr("id");
    $("#aj_load").fadeOut("slow", function()
    {                
        loadXML('archive/' + buttonID + '.html');
    });
});

编辑:刚刚修改了您的脚本,上面的工作正常。它看起来也不错。想想我可能会在重建我的网站时捏这个想法;)