jquery中$.getJSON 的使用方法
- - CSDN博客推荐文章通过 HTTP GET 请求载入 JSON 数据. data : 待发送 Key/value 参数. callback : 载入成功时回调函数. getJson的使用方法 jQuery.getJSON(url,[data],[callback]). 要获得一个json文件的内容,就可以使用$.getJSON()方法,这个方法会在取得相应文件后对文件进行处理,并将处理得到的JavaScript对象提供给代码.
jQuery.getJSON(url, [data], [callback])
通过 HTTP GET 请求载入 JSON 数据。
url : 发送请求地址。
data : 待发送 Key/value 参数。
callback : 载入成功时回调函数。
getJson的使用方法 jQuery.getJSON(url,[data],[callback])
要获得一个json文件的内容,就可以使用$.getJSON()方法,这个方法会在取得相应文件后对文件进行处理,并将处理得到的JavaScript对象提供给代码.
回调函数提供了一种等候数据返回的方式,而不是立即执行代码,回调函数也需要一个参数,该参数中保存着返回的数据。这样我们就可能使用jQuery提供的另一个全局函数(类方法).each()来实现循环操作,将.getJSON函数返回的每组数据循环处理。
package com.servlet; import java.io.IOException; import java.io.PrintWriter; import java.util.ArrayList; import java.util.List; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import net.sf.json.JSONArray; import com.entity.City; /** * @author Administrator * 返回json字符串 * * 这里是用传统方法做的一个简单列子! * 整合struts,这种写法也能实现,但struts2已经实现了json,比这个写法方便 * */ public class GetJsonServlet extends HttpServlet { public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { this.doPost(request, response); } public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setCharacterEncoding("utf-8"); PrintWriter out = response.getWriter(); /*返回一个list集合来绑定下拉框*/ List<City> list = new ArrayList<City>(); list.add(new City(1,"AAAA")); list.add(new City(2,"BBBB")); list.add(new City(3,"CCCC")); list.add(new City(4,"DDDD")); //获取集合的json字符串 JSONArray json = JSONArray.fromObject(list); System.out.println(json.toString()); //打印结果: //[{"id":1,"name":"AAAA"},{"id":2,"name":"BBBB"},{"id":3,"name":"CCCC"},{"id":4,"name":"DDDD"}] out.print(json.toString()); out.flush(); out.close(); } }
jsp页面代码:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>My JSP 'index.jsp' starting page</title> <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script> <script type="text/javascript"> //初始加载页面时 $(document).ready(function(){ alert("加载.............."); var city=$("#city");//下拉框 $.getJSON("GetJsonServlet",function(data){ //通过循环取出data里面的值 $.each(data,function(i,value){ var tempOption = document.createElement("option"); tempOption.value = value.id; tempOption.innerHTML = value.name; city.append(tempOption); }); }); }); </script> </head> <body> <select id="city"> <option>==选择==</option> </select> </body> </html>
实体类就俩属性:
private Integer id; private String name;
以上能实现在页面加载的时候,把内容绑定到下拉框!
通过打印流,是ajax常用的方法!
点击我
. 像上面这样把JavaSript代码和HTML代码混杂在一起的做法同样也非常不妥,因为它并没有将网页内容和行为分离,所以才有JQuery选择器的学习.点击我
. //给class为demo的元素添加行为.