The ajax function of the jQuery framework- (get) (get)(get)(post)
[External link image transfer failed, the source site may have an anti-leech link mechanism, it is recommended to save the image and upload it directly (img-rw3ZjWHk-1600399755294)( 
)]
##$.get request-principle
get function
$.get(url, [data], [callback], [type])
url: indicates the access path of the server, such as: "s1"
data: indicates the parameters sent to the server, format: 1: "username=wzx&password=123" 2: json string
callback: anonymous function, which means receiving the response sent by the server, this function is automatically executed
type: indicates the type of data the browser expects from the server, format: "text" "json"
get request principle
##jquery_ajax.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery-3.3.1.js"></script>
<script type="application/javascript">
$(function () {
$("#btn").on("click", function () {
$.get(
"s2",
"username=lbl&password=admin123",
function (data) {
//这个data就是服务器返回的字符串
//处理数据
alert(data);
},
"text"
);
})
})
</script>
</head>
<body>
<!--设计一个按钮，一点击这个按钮，就向服务器发出异步请求-->
<input type="button" value="点我，发出异步请求s2" id="btn"/>
</body>
</html>
running result:
##AjaxServlet2：
package com.lbl.servlet;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
@WebServlet("/s2")
public class AjaxServlet2 extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
System.out.println("收到了异步请求....s2");
response.getWriter().write("helloworld...s2");
String username = request.getParameter("username");
String password = request.getParameter("password");
System.out.println(username);
System.out.println(password);
}
}
running result:
Same for Post
jquery_ajax_post.html complete code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery-3.3.1.js"></script>
<script type="application/javascript">
$(function () {
$("#btn").on("click", function () {
$.get(
"s2",
"username=lbl&password=admin123",
function (data) { //这个data就是服务器返回的字符串
//处理数据
alert(data);
},
"text"
);
$.post(
"s2",
"username=lft&password=123",
function(data){ //这个data就是服务器返回的字符串 var data = []
//处理数据
},
"json"
);
var url = "s2";
var param = "username=lft&password=123";
var func = function(data){
};
var type = "json";
$.post(url,param,func,type);
})
})
</script>
</head>
<body>
<!--设计一个按钮，一点击这个按钮，就向服务器发出异步请求-->
<input type="button" value="点我，发出异步请求s2" id="btn"/>
</body>
</html>