日期:2014-05-16  浏览次数:20432 次

Jqurey+ajax得到后台JSON实现下拉框选项简单实例解析
	$(document).ready(
		function() {

			$.ajax({
				url : "userList.do",
				dataType : "json",
				data : "{}",
				textField : "name",
				valueField : "id",
				contentType : "application/json;charset=utf-8",
				traditional : true,
				success : function(data) {
					var option = null;
					//遍历所得到的JSON
					$.each(data.result, function(i, item) {
						option+="<option value=\"" + item.id + "\" >"+ item.name + "</option>";
					});
					$("#name").html(option);//填充下拉框选项
				},
				error : function(msg) {
					alert("出错了!");
				}
			});
		});

ajax参数解析如下:

?

??? ?? url:ajax请求的地址
??????? datatype:ajax请求返回的数据格式,可以是"xml”或"json”,默认为"json”
??????? textfield:ajax请求返回的数据中下拉列表框选项文本的字段,默认为"text”
??????? valuefiled:ajax请求返回的数据中下拉列表框选项值的字段,默认为"value”
??????? keepold:布尔类型,是否保留下拉列表框选项原有选项,默认为不保留
??????? selected:数值型,填充选项后第几项为选中状态,默认为0

?

对应的后台返回的Json格式为:

?

{"totalCount":2,"result":[{"id":1,"name":"王兴"},{"id":3,"name":"陈星"}]}
?

?