簡體   English   中英

如何使用ajax將新頁面加載到div中

[英]How to use ajax to load new page into div

我的網站由兩頁組成。 我正在嘗試將第2頁加載到第1頁的div中,然后顯示第2頁onclick。 我正在嘗試使用以下不起作用的代碼。 我是新手,所以如果這只是一個愚蠢的問題,我很抱歉。

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $.ajax({url:"myPage2.html",success:function(result){
      $("#div1").html(result);
    }});
  });
});
</script>
</head>
<body>

<div id="div1"><h2>Let jQuery AJAX Change This Text</h2></div>
<button>Get External Content</button>

</body>
</html>

您在加載網址中有一個#符號。

另外,你為什么不使用:

$("#div1").load("myPage2.html");

從URL中刪除#后,您的代碼應該可以正常工作。 這是一個稍微簡潔的版本:

$("button").click(function(){
  $("#div1").load("myPage2.html");
});

jQuery.load()

你的問題不是你的代碼。 正如你在這個Plnkr中看到的,它運行沒有任何問題。

.load()函數可以簡化您當前的代碼,但它不能解決您的實際問題,因為它只是語法糖。

由於某種原因,您的瀏覽器無法找到myPage2.html ,因此無法正確顯示它。

#myPage2.html中符號可能是導致錯誤的原因。

除此之外,如果你願意,你也可以這樣做:

$('button').click(function() {

    $('#div1').load('myPage2.html');

});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM