//创建jqueryAjax.html文件
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>//将js文件jquery-1.11.3.min.js导入到文件夹JS中
<script>
function fn1(){
$.get(
"/day480/ajaxJquery",
{"name":"qiang","age":20},
function(data){
alert(data.name)
},
"json"
);
}
function fn2(){
$.post(
"/day480/ajaxJquery",
{"name":"tong","age":21},
function(data){
alert(data.name)
},
"json"
);
}
function fn3(){
$.ajax({
url:"/day480/ajaxJquery",
async:true,
type:"POST",
data:{"name":"zhangyi","age":19},
success:function(data){
alert(data.name)
},
error:function(){
alert("请求失败");
},
dataType:"json"
});
}
</script>
</head>
<body>
<input type="button" value="显式提交 " onclick="fn1()"><span id="span1"></span>
<input type="button" value="隐式提交 " onclick="fn2()"><span id="span2"></span>
<input type="button" value="ajax隐式提交 " onclick="fn3()"><span id="span3"></span>
</body>
</html>
//创建servlet AjaxJquery ajaxJquery
package Demo;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class AjaxJquery extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
String name = request.getParameter("name");
String age = request.getParameter("age");
System.out.println(name+ " " +age);
response.setContentType("text/html;charset=utf-8");
response.getWriter().write("{"name":"tou头强","age":22}");
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doGet(request, response);
}
}