笔记——Ajax

2017-11-05 12:27:05来源:CSDN作者:qq_34902684人点击

分享

什么是Ajax

AJAX(Asynchronous JavaScript and XML.)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。

js原生的Ajax

get请求

		//创建ajax引擎对象 ---- 所有的操作都是通过引擎对象		var xmlHttp = new XMLHttpRequest();		//绑定监听 ---- 监听服务器是否已经返回相应数据		xmlHttp.onreadystatechange = function(){			if(xmlHttp.readyState==4 && xmlHttp.status==200){				//接受相应数据				var res = xmlHttp.responseText;				document.getElementById("span1").innerHTML = res;			}		}		//绑定地址		xmlHttp.open("GET","/ajax/ajaxServlet?name=zy",true);		//发送请求		xmlHttp.send();

post请求

		//创建ajax引擎对象 ---- 所有的操作都是通过引擎对象		var xmlHttp = new XMLHttpRequest();		//绑定监听 ---- 监听服务器是否已经返回相应数据		xmlHttp.onreadystatechange = function(){			if(xmlHttp.readyState==4 && xmlHttp.status==200){				//接受相应数据				var res = xmlHttp.responseText;				document.getElementById("span1").innerHTML = res;			}		}				xmlHttp.open("POST","/ajax/ajaxServlet",true);		//注意:如果是post提交,在发送请求之前设置一个头		xmlHttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");		xmlHttp.send("name=zy");
servlet编写

		String name = request.getParameter("name");		response.getWriter().write(name+Math.random());


Jquery的Ajax技术

1.$.get(url, [data], [callback], [type]) 和 $.post(url, [data], [callback], [type])

urlString

待载入页面的URL地址

data (可选)Map

待发送 Key/value 参数。

callback (可选)Function

载入成功时回调函数。

type (可选)String

返回内容格式,xml, html, script, json, text, _default。

例子:

		$.get(			"/ajax/ajaxServlet2", //url地址			{"name":"zy","age":25}, //请求参数			function(data){ //执行成功后的回调函数				document.getElementById("span1").innerHTML = data.name + "  " + data.age;			},			"json"		);



2.$.ajax([options] )

常用的option有如下:
async:是否异步,默认是true代表异步
data:发送到服务器的参数,建议使用json格式
dataType:服务器端返回的数据类型,常用text和json
success:成功响应执行的函数,对应的类型是function类型
type:请求方式,POST/GET
url:请求服务器端地址
例子:
		$.ajax({			url:"/ajax/ajaxServlet2",			async:true,			type:"POST",			data:{"name":"zy","age":18},			success:function(data){				document.getElementById("span3").innerHTML = data.name + "  " + data.age;			},			error:function(){				alert("请求失败");			},			dataType:"json"		});

3.servlet编写

1.直接使用java返回一个json格式的字符串
		String name = request.getParameter("name");		String age = request.getParameter("age");					//java代码只能返回一个json格式的字符串		response.setContentType("text/html;charset=UTF-8");		String json = "{/"name/":/"" + name+ "/",/"age/":" + age + "}";		response.getWriter().write(json);

2.使用json的转换工具将对象或集合转成json格式的字符串
jsonlib
		String name = request.getParameter("name");		String age = request.getParameter("age");		User user = new User();		user.setAge(age);		user.setName(name);			JSONObject fromObject = JSONObject.fromObject(user);		response.setContentType("text/html;charset=UTF-8");		response.getWriter().write(fromObject.toString());

GSON
		String name = request.getParameter("name");		String age = request.getParameter("age");		User user = new User();		user.setAge(age);		user.setName(name);				Gson gson = new Gson();		response.getWriter().write(gson.toJson(user));



最新文章

123

最新摄影

闪念基因

微信扫一扫

第七城市微信公众平台