DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> JQuery中getJSON的使用方法
JQuery中getJSON的使用方法
編輯:JQuery特效代碼     
這裡采用了JSONP(JSON with Padding-填充json數據也就是常用的json跨域方式):利用script標簽,通過特定的src地址的調用,來執行一個客戶端的js函數,在 服務器端生成相對的數據(JSON格式)並以參數的形式傳遞給這個客戶端的js函數並執行這個函數,前提是需要服務器端的數據輸出支持。在JQuery1.2以後支持JSONP的應用。

JSON 是一種含有簡單括號結構的純文本,因此許多通道都可以交換 JSON 消息。因為同源策略的限制,我們不能在與外部服務器進行通信的時候使用 XMLHttpRequest。而JSONP是一種可以繞過同源策略的方法,即通過使用 JSON 與 <script> 標記相結合的方法,從服務端直接返回可執行的JavaScript函數調用或者JavaScript對象。

整個調用過程中,起關鍵作用的是jsoncallback=?,在客戶端調用時需在請求地址中添加參數:jsoncallback=?;同時服務器端則需要把jsoncallback的值作為方法名傳回來。

服務端代碼:
代碼如下:
protected void Page_Load(object sender, EventArgs e)
{
Response.Write(Request.QueryString["jsoncallback"] + "({name:'test'})");
}

html頁面調用:
代碼如下:
<html xmlns="http://www.w3.org/1999/xhtml" >
<head >
<script type="text/javascript" src="jquery-1.4.4.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$.getJSON("http://localhost:10272/test.aspx?jsoncallback=?",
function(data) {
$("#divHeaderLink").html(data.name);
});
});
</script>
</head>
<body>
<div id="divHeaderLink">
</div>
</body>
</html>

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved