爲什麼這不起作用？ jQuery的AJAX替換特定的div內容

下面我有我的網站上的代碼，但是當我在這個特殊的div點擊上鏈接它只是打開一個新的窗口，這是爲什麼？爲什麼這不起作用？ jQuery的AJAX替換特定的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); 
     } 
    }); 
}); 
});

編輯：

我仍然havnt想通了這一點，但這裏是我在哪裏，我的腳本如下

<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不允許Origin null。

我不知道這意味着什麼，所以一旦我得到它在這裏工作，那麼我必須解決與實際網站上的Jquery的問題。

來源

2011-10-26 Chris James Champeau

您的成功處理程序應該只有'data'作爲HTML（除非這是調用並獲取JSON或XML對象，處理程序的簽名是成功的（data，textStatus，jqXHR），其中數據是 –

你應該調用你想獲得指定類型的ajax。

$.ajax({ 
     url: pageLocation, 

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

來源

2011-10-26 01:15:26 Popara

您的權利，但它似乎仍然工作，可以有一個問題，因爲我的文檔中的腳本是在哪裏？ –

錯誤「Access-Control-Allow-Origin」是由您嘗試訪問其他域導致的。來自其他域的響應應該包含頭域參數「Access-Control-Allow-Origin」與您的域名或* – Popara

在成功回調，您的數據對象必須是一個JSON對象，以遏制responseText所以你需要在AJAX調用設置dataType場'json'。在你目前的情況下，它看起來像你檢索html回來。查看關於jquery.com的ajax文檔以獲取更多信息。

嘗試使用javascript console在鉻或firebug在火狐看到任何錯誤。您可能在頁面加載中找到一個

編輯： 您正在使用您的文件系統！由於瀏覽器執行相同的源策略，您無法在整個文件系統中進行Ajax調用。這意味着你不能向其他服務器發送ajax請求。您需要將您的html頁面放在同一個域中才能完成請求。當你的域名是www.mydomain.com時，你在做什麼就像從www.google.com請求數據一樣。您只能從www.mydomain.com請求數據。你要做的最好的事情是在你的機器上建立一個Apache服務器。

來源

2011-10-26 00:57:41 Trevor

'this.href'應該是一個帶有'href'值的'ANCHOR'：http://jsfiddle.net/nbMn6/ –

你說得對！我會看到... – Trevor

我做了改變$（this）.attr（「href」）;'而不是隻是'this.href''然而我是一個小混混在ajax調用，如果你能幫助我 –

根據您的更新，您嘗試過$（「＃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/

來源

2011-10-26 01:43:43

看起來似乎不工作 –

我建議使用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時缺少分號。

希望這會有所幫助！

來源

2011-10-26 01:48:48 Joey

我認爲使用您的代碼應該警告加載，如果它工作，並且因爲它是不是，我不知道我的問題在哪裏 –

你有沒有機會使用一個單獨的js文件來放置這段代碼？或者它與HTML相同？ – Joey

此代碼是相同的頁面，我喜歡在頭文件中的Jquery' ' –

所以我能夠弄明白，它使用鉻和訪問我的C盤上的文件，使用它的Safari瀏覽器工作，現在我只是有一個問題與衝突的jQuery，但我會做一些研究現在，感謝所有幫助人員。

來源

2011-10-26 18:05:08

爲什麼這不起作用？ jQuery的AJAX替換特定的div內容

回答

相關問題