JQuery操作JSON數據


1.在我們的項目中jquery的js文件。 
2.新建一個htm文件,命名為dome.htm吧。 
代碼如下:(head區的js代碼就是實現的全部代碼,有詳細注釋) 

復制代碼代碼如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>jquery獲取json數據演示頁面</title> 
<script type="text/javascript" src="js/jquery-1.2.1.pack.js"></script> 
<script type="text/javascript"> 
function getData(){ 
$("#list").html("");//清空列表中的數據 
//發送ajax請求 
$.getJSON( 
"jsondata.ashx",//產生JSON數據的服務端頁面 
{name:"test",age:20},//向服務器發出的查詢字符串(此參數可選) 
//對返回的JSON數據進行處理,本例以列表的形式呈現 
function(json){ 
//循環取json中的數據,並呈現在列表中 
$.each(json,function(i){ 
$("#list").append("<li>name:"+json[i].name+"  Age:"+json[i].age+"</li>") 
}) 
}) 

</script> 
</head> 
<body> 
<input id="Button1" type="button" value="獲取數據" onclick="getData()" /> 
<ul id="list"></ul> 
</body> 
</html> 


3.我們再建一個一般應用程序(jsonData.ashx) 
代碼如下: 

復制代碼代碼如下:

<%@ WebHandler Language="C#" class="jsonData" %> 
using System; 
using System.Web; 
public class jsonData : IHttpHandler { 
public void ProcessRequest (HttpContext context) { 
context.Response.ContentType = "text/plain"; 
string data = "[{name:\"ants\",age:24},{name:\"lele\",age:23}]";//構建的json數據 
//下面兩句是用來測試前台向此頁面發出的查詢字符 
string querystrname = context.Request.QueryString.GetValues("name")[0];//取查詢字符串中namer的值 
string querystage = context.Request.QueryString.GetValues("age")[0];//取查詢字符串中age的值 
context.Response.Write(data); 

public bool IsReusable { 
get { 
return false; 



對以上的內容我只說一點,那就是前台頁面中的$.getJSON方法 
$.getJSON(url, params, callback) 
用一個HTTP GET請求一個JavaScript JSON數據 
返回值:XMLHttpRequest 
參數: 
url (String): 裝入頁面的URL地址。 
params (Map): (可選)發送到服務端的鍵/值對參數。 
callback (Function): (可選) 當數據裝入完成時執行的函數.


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM