国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

jQuery - AJAX load() 方法

jQuery load() 方法

load() 方法從伺服器載入數(shù)據(jù),並把傳回的資料放入被選元素中。

語法:

$(selector).load(URL,data,callback);

必要的?URL?參數(shù)規(guī)定您想要載入的URL。

可選的?data?參數(shù)規(guī)定與請求一同傳送的查詢字串鍵/值對集合。

可選的?callback?參數(shù)是 load() 方法完成後所執(zhí)行的函數(shù)名稱。

這是範(fàn)例檔案("demo_test.txt")的內(nèi)容:

<h2>jQuery AJAX 是個(gè)非常棒的功能!</h2>
<p id="p1">這是段落的一些文本。</p>


把檔案"demo_test.txt" 的內(nèi)容載入到指定的<div> 元素中:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
    $("button").click(function(){
         $("#div1").load("/try/ajax/demo_test.txt");
    });
});
</script>
</head>
<body>
    <div id="div1"><h2>使用 jQuery AJAX 修改文本內(nèi)容</h2></div>
    <button>獲取外部內(nèi)容</button>
</body>
</html>

也可以把jQuery 選擇器加入到URL 參數(shù)。

範(fàn)例把"demo_test.txt" 檔案中id="p1" 的元素的內(nèi)容,載入到指定的<div> 元素中:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
    $(document).ready(function(){
      $("button").click(function(){
        $("#div1").load("/try/ajax/demo_test.txt #p1");
      });
    });
</script>
</head>
<body>
    <div id="div1"><h2>使用 jQuery AJAX 修改文本</h2></div>
    <button>獲取外部文本</button>
</body>
</html>

可選的callback 參數(shù)規(guī)定當(dāng)load() 方法完成後所要允許的回呼函數(shù)?;睾艉瘮?shù)可以設(shè)定不同的參數(shù):

responseTxt?- 包含呼叫成功時(shí)的結(jié)果內(nèi)容

statusTXT?- 包含呼叫的狀態(tài)

xhr?- 包含XMLHttpRequest 物件

xhr?- 包含XMLHttpRequest 物件

#下面的範(fàn)例會(huì)在load() 方法完成後顯示一個(gè)提示框。如果load() 方法已成功,則顯示"外部內(nèi)容載入成功!",而如果失敗,則顯示錯(cuò)誤訊息:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#div1").load("/try/ajax/demo_test.txt",function(responseTxt,statusTxt,xhr){
      if(statusTxt=="success")
        alert("外部內(nèi)容加載成功!");
      if(statusTxt=="error")
        alert("Error: "+xhr.status+": "+xhr.statusText);
    });
  });
});
</script>
</head>
<body>
    <div id="div1"><h2>使用 jQuery AJAX 修改該文本</h2></div>
    <button>獲取外部內(nèi)容</button>
</body>
</html>

完整實(shí)例:

先建立一個(gè)text.html檔案:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>php中文網(wǎng)(php.cn)</title>
  </head>
  <body>
      <div class="comment">
        已有評論:
      </div>
      <div class="comment">
        <h6>張三:</h6>
        <p class="para">沙發(fā)。</p>
      </div>
      <div class="comment">
        <h6>李四:</h6>
        <p class="para">板凳。</p>
      </div>
      <div class="comment">
        <h6>王五:</h6>
        <p class="para">地板。</p>
      </div>
  </body>
</html>


在建立另一個(gè)HTML檔案(名稱可以隨意取)寫入jQuery?AJAX ??load() 方法:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>php中文網(wǎng)(php.cn)</title>
    <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("#send").click(function(){
                $("#resText").load("text.html");  //引入text.html文件。
            });
        });
    </script>
</head>
<body>
    <input type="button" id="send" value="Ajax獲取" />
    <div id="resText"></div>
</body>
</html>
########
繼續(xù)學(xué)習(xí)
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#send").click(function(){ $("#resText").load("text.html"); //引入text.html文件。 }); }); </script> </head> <body> <input type="button" id="send" value="Ajax獲取" /> <div id="resText"></div> </body> </html>
提交重置程式碼