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 <div id="links"> <a href="testvid.html"><img src="img/thumbs/img3.jpg" /></a>

中使用它的方法

但仍然没有，请告诉我你的想法。

修改

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

中的这个错误

17XMLHttpRequest无法加载file：///Users/semaj4712/Desktop/WME%20Website/testvid.html。 Access-Control-Allow-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

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

尝试使用 chrome 中的javascript console或 firefox 中的firebug查看错误。您可能会在页面上找到一个

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

Answer 4

根据你的更新，你试过$（“＃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 5

所以我能够弄明白，它与使用chrome和访问我的c盘上的文件有关，当使用safari工作时，现在我只是有一个冲突jquery的问题，但我会做一些研究现在，感谢所有帮助人员。

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

5 个答案: