为什么这不起作用？ jquery ajax替换特定div中的内容

Question

下面我的网站上有代码，但是当我点击这个特定div中的链接时，它只是打开一个新窗口，为什么这？？

$(function(){   
//bind a click event to the nav links
$("#links a").bind("click", function(e){ 

    //keep the links from going to another page by preventing their default behavior
    e.preventDefault();

    //this = link; grab the url
    var pageLocation = this.href;

    //fire off an ajax request
    $.ajax({ 
        url: pageLocation, 

        //on success, set the html to the responsetext
        success: function(data){ 
            $("#biocontent").html(data.responseText); 
        } 
    });
});
});

编辑：

我仍然没有弄清楚这一点，但这就是我所在的位置，我的脚本如下

  <script type="text/javascript">(function(){   
//bind a click event to the nav links
$("#links a").bind("click", function(e){ 

    //keep the links from going to another page by preventing their default behavior
    e.preventDefault();

    //this = link; grab the url
    var pageLocation = $(this).attr("href")

    //fire off an ajax request
   $.ajax({ 
    url: pageLocation, 

    //on success, set the html to the responsetext
    success: function(data){ 
        $("#biocontent").html(data); 
    },
    dataType : "html"
     });
});

}）；

这是我在 html

中使用它的方式

但仍然不行，请告诉我你的想法。

编辑

所以我把这段代码的最小部分移到一个新文档中，现在它根本不起作用，但我觉得我在 Jquery 上遇到了问题，所以现在它是工作，我在

17XMLHttpRequest 无法加载文件:///Users/semaj4712/Desktop/WME%20Website/testvid.html。 Access-Control-Allow-Origin 不允许 Origin null。

我不知道这意味着什么，所以一旦我让它在这里工作，我就必须在实际站点上使用 Jquery 解决问题。

Answer 1

您应该使用您想要获取的指定类型来调用 ajax。

 $.ajax({ 
        url: pageLocation, 

        //on success, set the html to the responsetext
        success: function(data){ 
            $("#biocontent").html(data); 
        },
        dataType : "html"
    });

Answer 2

我建议改用 jQuery load 函数：

$(document).ready(function(){

    $("#links a").bind("click", function(e){

        e.preventDefault();

        var pageLocation = $(this).attr('href');

        $("#biocontent").load(pageLocation,function(){
            alert('Loaded!');
        }); 
    });
});

这是检索数据最简单、最有效的方法，并且根据您的代码，我假设这只是 HTML。

此外，在您最新的编辑中，您在定义 pageLocation 时缺少分号。

希望这有帮助！

Answer 3

根据您的更新，您尝试过 $("#biocontent").load(pageLocation) 吗？这似乎与您想要做的事情一致。

$(function(){   
    //bind a click event to the nav links
    $("#links a").bind("click", function(e){ 
        //keep the links from going to another page by preventing their default behavior
        e.preventDefault();

        //this = link; grab the url
        var pageLocation = this.href;
        $("#biocontent").load(pageLocation);

    });
});

http://api.jquery.com/load/

Answer 4

在成功回调中，您的数据对象需要是 JSON 对象才能包含 responseText，因此您需要在中设置 dataType 字段对 'json' 的 ajax 调用。在您目前的情况下，您似乎正在检索 html 。查看 jquery.com 上的 ajax 文档以获取更多信息。

尝试使用 chrome 中的 javascript 控制台 或 firefox 中的 firebug 查看是否有错误。您可能会在页面加载中找到一个

编辑：
您正在处理您的文件系统！由于浏览器强制执行同源策略，您无法跨文件系统进行 ajax 调用。这意味着您无法向其他服务器发出 ajax 请求。您需要将 html 页面放在同一域中才能完成请求。当您的域名是 www.mydomain.com 时，您所做的就像从 www.google.com 请求数据一样。您只能从 www.mydomain.com 请求数据。对你来说最好的办法是在你的机器上设置一个 apache 服务器。

Answer 5

所以我能够弄清楚，它与使用 chrome 和访问我的 c 驱动器上的文件有关，当使用 safari 时它有效，现在我只是遇到了冲突的 jquery 问题，但我现在会对此做一些研究，谢谢感谢所有的帮助者。