AJAX概念及作用。 JQuery中關於AJAX的幾個常用的函數


1.ajax是什么?作用是什么?

ajax是一種無需再重新加載整個網頁的情況下,能夠更新部分網頁的技術,那什么是ajax呢? 

 

AJAX = Asynchronous JavaScript and XML(異步的 JavaScript 和 XML)。

AJAX 不是新的編程語言,而是一種使用現有標准的新方法。

AJAX 是與服務器交換數據並更新部分網頁的藝術,在不重新加載整個頁面的情況下。是一種用於快速創建動態網頁的技術。通過在后台於服務器進行少量的數據交換,AJAX可以實現網頁異步的更新

傳統的網頁(不適用ajax)如果內容需要更新的話,必須重載政哥哥網頁面。

 

2.JQuery的一些常用的針對ajax的函數

   (1) $.ajax(

          type:   ,

          url:     ,

          data:    ,

          success:function(data){

              ........

                },

          error:function(){

            ........}

這個是比較復雜的ajax調用

            )

jsp頁面

<head>
  <title>Ajax驗證</title>
  <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
  <script type="text/javascript">
    $(function () {
      $("[name='userName']").blur(function () {     
        $.ajax({
          type: "post",
          url: "/TestServlet",
          data:{action:"login"},     //data 傳遞的參數一般都是key:“ value” 類型的 value一定要加引號 我親身體驗 那種找不到錯的感覺
          // dataType:'Text',      //servers 返回的格式 也可以是gjon
          success: function (data) {
            if (data == "success") {
              alert(data);
              $("#myspan").html(data);
            }
          },
          error: function () {      //這個用的比較少
          }
        })
      })
    })
  </script>
</head>
<body>
   姓名: <input name="userName" type="text"><span id="myspan"></span>
   密碼: <input name="password" type="text">
</body>

  servlet后台代碼:

public class TestServlet extends HttpServlet {
  protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    String name = request.getParameter("action");
    System.out.println(name);
    if(name.equals("login")){
      response.getWriter().write("success");  //返回回掉函數的參數
    }else{
      response.getWriter().write("file");
    }
  }

(2)$.post()

$.post("/TestServlet",
         {"uname":$('[name=uname]').val()},
         function (data) {
           alert(data);
         });

詳解:

jquery中$.post()方法的簡單實例

在jqery中有這樣一個方法,$.post()下面就這個方法做一個簡單的實例:

jQuery.post( url, [data], [callback], [type] ) :使用POST方式來進行異步請求

參數:

url (String) : 發送請求的URL地址.

data (Map) : (可選) 要發送給服務器的數據,以 Key/value 的鍵值對形式表示。

callback (Function) : (可選) 載入成功時回調函數(只有當Response的返回狀態是success才是調用該方法)。

type (String) : (可選)官方的說明是:Type of data to be sent。其實應該為客戶端請求的類型(JSON,XML,等等)

$.load():

$("#msg").load(     //可以直接拿到文本框 的值
         "/TestServlet","action="+$('[name="userName"]').val()
         );
//后台可以直接 根據request.getParameter()拿到參數的值

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM