jquery中$.getJSON 的使用方法
阿新 • • 發佈:2019-02-08
jQuery.getJSON(url, [data], [callback])
通過 HTTP GET 請求載入 JSON 資料。
引數: url,[data],[callback] String,Map,FunctionV1.0url : 傳送請求地址。
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常用的方法!