簡體   English   中英

使用AJAX將html文件的內容加載到div中

[英]load the content of html file into the div using AJAX

我是初學者。 我正在處理的問題可能很容易解決;)我正在處理一個網頁,其中文本內容從外部html文件加載到div中。 當用戶單擊菜單項時,將完成此操作。

這是我的代碼html:

<html>
<head>
<link rel="stylesheet" type="text/css" href="css/menu.css">
<script type="text/javascript" src="js/js.js"></script>

</head>
<body>
          <div>
                      <ul>      
                          <li><a id="teachers" href="#" name="teachers" onclick="getdata()">
                            Teachers
                          </li> 
                        </ul>
          </div>

          <div id="page"  name="" >
            bla bla bla ...
          </div>

</body>
</html>

這是我的代碼ajax:

var _xhr;

function getdata(){

    _xhr= new XMLHttpRequest();
    _xhr.onreadystatechange=callback;
    _xhr.open("POST", "teachers.html", true);
    _xhr.send();

    function callback(){
        var _target = document.getElementById("page");
        _target.innerHTML=_xhr.responseText;
    }

}

當我點擊鏈接(教師)時,我想將html文件(teachers.html)加載到div(id =“ page”)中

請有人幫我。

提前致謝。

onreadystate會觸發多次。 您需要等待4的readystate才能讀取responseText

function callback(){
    if (_xhr.readyState===4) {
        var _target = document.getElementById("page");
        _target.innerHTML=_xhr.responseText;
    }
}

您可能還應該檢查狀態。

暫無
暫無

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

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