我是一个Java Web新手程序员,今天来总结一下用AJAX向后台传递数据的写法,如有问题欢迎指正。
首先我们来重申一下在JQuery中封装的AJAX的写法(相对于原生js写法):
$.ajax({
type : "post",
url : "Student_Change_Password",
data : $("#form").serialize(),
success : function(msg){
alert(msg);
},
error : function(msg){
alert("error");
},
complete : function(){
},
});
其中,
type是HTML请求类型,可以选post或get;
url是目标路径,可以是jsp或servlet;
data是要传输给目标路径的数据,$("标签id").serialize()是将所选标签内容序列化成JSON数据的方法,比如里面写form标签的id,那么这个form表单里面的标签都会被写入data中。目标文件取的时候直接request.getParameter("标签name")即可;
success,error,complete是回调函数。AJAX是前台和后台进行异步通信的过程,前台发data给后台,后台还得发点数据回来,回来后的落脚点就是回调函数。如果AJAX通信成功了,就执行success方法;失败了就执行error方法;执行完success或error后执行complete方法,表示AJAX通信结束。
本文就是要介绍一下:data怎么写
P.S:JavaScript基本数据类型:字符串、数字、布尔、数组、对象、Null、Undefined
举一个例子:在jsp页面中,利用<%%>取到了上个页面传来的两个数据,一个字符串,一个整型。在JS中定义了一个数组。使用AJAX传这三个变量。
<%
String req_str = request.getParameter("str");
Integer req_id = request.getParameter("id");
%>
<script type="text/javascript" src="../js/jquery-1.11.1.min.js"></script>//引入JQuery文件,src的内容因项目路径而异
<script type="text/javascript">
var str = '<%= req_str %>';//字符串类型不要忘记引号!
var id = <%= req_id %>;
var arr = new Array();//定义一个数组
for(var i = 0; i < id;i++){
arr[i] = i;
}
$(function(){//是页面加载时执行的初始化方法,类似C++的构造方法
//注意下面括号匹配
$("#触发AJAX的标签id").click(function (){//click方法是标签点击时触发
$.ajax({
type : "post",
url : "Student_Judge",//servlet
contentType:"json",
data : {"a_arr":arr,"a_id":id,"a_str":str},
traditional : true,//如果要传数组,这行一定要加!用传统的方式来序列化数据
success : function(msg){
alert(msg);
},
error : function(){
alert("error");
},
});
});//click
});//初始化方法
</script>
JSP页面编写完毕,接下来看一下servlet的部分(如果AJAX的url写的是jsp,那就去目标jsp中用<%java代码%>取值,和这个jsp那段类似),如果type选post,那么就会访问servlet的doPost()方法;如果type是get,就会访问doGet()方法。
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String str = request.getParameter("a_str");
Integer id = Integer.valueOf(request.getParameter("a_id"));//Integer.valueOf() 将字符串转换成Integer类型
String[] arr = request.getParameterValues("a_arr");//getParameterValues() 取数组
}