总结jQuery中ajax,post和get用法

不擅长前端页面开发,许久不用,有点忘记了,上午敲了两个demo,总结一下.

思路:前台页面使用ajax发送请求,请求控制器,控制器调用mapper,查询到数据后,以json格式返回给前端页面.在前端页面遍历显示出来.

实例一:使用$.ajax()

$.ajax({
			"url":"${pageContext.request.contextPath }/list",
			"type":"get",
			success:function(data){
				var result = "";
				for(var i=0;i<data.length;i++){
					result +="<tr>";
					result +="<td>"+data[i].id+"</td>";
					result +="<td>"+data[i].name+"</td>";
					result +="</tr>";
				}
				$("#mytbody").html(result);
			},
			"dataType":"json"
		});

实例二:使用$.post()

$.post(
		"${pageContext.request.contextPath }/list",
		"post",
		function(data){
			var result = "";
			for(var i=0;i<data.length;i++){
				result +="<tr>";
				result +="<td>"+data[i].id+"</td>";
				result +="<td>"+data[i].name+"</td>";
				result +="</tr>";
			}
			$("#mytbody").html(result);
		},
		"json"
		);

实例二:使用$.get()

$.get(
			"${pageContext.request.contextPath }/list",
			"get",
			function(data){
				var result = "";
				for(var i=0;i<data.length;i++){
					result += "<tr>";
					result += "<td>"+data[i].id+"</td>";
					result += "<td>"+data[i].name+"</td>";
					result += "</tr>";
				}
				$(#mytbody#mytbody).html(result);
			},
			"json"
		); 

总结1:$.ajax({})格式,里面有花括号,例如

$.ajax({

"url":"list",

"type":"post",

success:function(data){},

"dataType":"json"

});

前面的双引号可以省略,即

$.ajax({

url:"list",

type:"post",

data:{"id":1,"name":"zhangsan"};

success:function(data){},

dataType:"json"

});

总结2:$.post();和$.get();格式一样的

$.post(

"list",

"post",

{"id":1,"name":"lisi"},

function(data){},

"json"

);

post和get里面没有花括号.发送给控制器的json格式,有严格要求.

猜你喜欢

转载自blog.csdn.net/springyh/article/details/80508215
今日推荐