jQuery AJAX

Posted 2020-10-20 gdwkong

　　

一、为什么要使用JQuery的AJAX

• 因为传统(js里面)的AJAX的开发中，AJAX有两个主要的问题：
• 浏览器的兼容的问题 , 编写AJAX的代码太麻烦而且很多都是雷同的。
• ?在实际的开发通常使用的Ajax是jQuery的ajax

二、JQuery的Ajax的API

• $.get(路径,[请求参数],[回调函数],[数据类型]); 数据类型：默认是字符串

• $.post(路径,[请求参数],回调函数,[数据类型]); 数据类型：默认是字符串

• $.getJSON(url,请求参数, 回调函数) 使用场景:服务器端响应给客户端的数据是json类型的时候

• 数据类型(dataType)："xml"、

  "html"、

  "text"、

  "script"、

  "json"、

  "jsonp"

三、入门

• get方法

$("#btn1").click(function(){
     //发送请求; $.get(url,[params],[function(result){}])
     $.get("${pageContext.request.contextPath }/demo01", 
　　　　　　　{"username":"zs","password":"123456"},
　　　　　　　function(result){    
           　　 alert(result);
     });
});

• post方法

$("#btn2").click(function(){
    //发送请求; $.post(url,[params],[function(result){}])
    $.post("${pageContext.request.contextPath }/demo01",
　　　　　　　　{"username":"zs","password":"123456"},
　　　　　　　　function(result){
          　　　　alert(result);

    });

});

• getJSON方法

//从 test.js 载入 JSON 数据，附加参数，显示 JSON 数据中一个 name 字段数据
//$.jQuery.getJSON(url,[data],[function(result){}])
$.getJSON("test.js", { name: "John", time: "2pm" }, 
　　function(json){
  　　　　alert("JSON Data: " + json.users[3].name);
});