服务热线:13794954498    QQ:86736139
[ 莞动力网络 ] 多年在东莞从事专业优质php网站开发、东莞网站建设、网页设计、特别是东莞地区php高端网站开发和维护。莞动力网络在技术领先的基础上,以后续的推广维护等优质的售后维护服务得到广大客户的好评。我们还把搜索引擎SEO优化融入于网站开发的各个阶段。在网站初期已经对程序优化作出严格要求,并为客户定制最合适的需求,以便于获得更好的用户体验和提高搜索引擎收录质量。
Jquery:getJSON方法解决跨站ajax (json的解剖和运用) --附图片加载时的lo
作者:    发布日期:2012-01-07    浏览量:278

 

json包括两种数据结构,一种类似于哈希表,另外一种类似于数组。 

简单的说,就是用xml传输数据的一个替代方案,传的字节数更少,传输的过程实质上是用{}或者[]包裹的字符串,在代码短解释对象。{}对应于object,[]对应于array,在代码端同样可以做反向操作。现在很多基于ajax的应用都是在服务器端获取数据,然后生成json,传到客户端,然后在客户端渲染界面。。 

再简单点,就是一种特定格式的字符串

 

OK,了解了JSON的结构,我们就可以回来看一下JQuery中的$.getJSON()方法了。该方法有三个参数,$.getJSON(String url, Hash params, Function callback)。其中,url是获取JSON结构数据的请求地址,即访问该地址会得到一段JSON结构的文本(这里被JQuery封装了,这一段文本是通过请求对象的responseText属性得到的)。params是向url地址的服务发送的参数,服务器可以根据这些参数做出响应。参数的结构跟JSON的结构类似,都是形似“{key1:value1,key2:value2}”的结构。callback为回调函数,即function(json){//code...},在这个函数中做客户端处理。在callback函数中,参数json就是通过向url请求得来的JSON结构文本构造出来的对象。json参数的使用很简单,它是一个哈希表对象,可以通过json.key的方式来使用其中定义的属性。例如,如果我们传入的是前面所述例子的JSON结构,我们可以通过json.addresses[0]来获取addresses的第一个值。 
JSON不神秘,说白了其实就是个哈希表结构,在JavaScript中可以直接使用,非常方便。

 

 //-------------------------------------------------------

google Access to restricted URI denied”,发现问题出在Cross-Domain上面,看了Jquery的开发资料得知,从1.2版本开始使用 jQuery.getJSON(url,[data],[callback]) 来进行跨域提交,参考如下:

As of jQuery 1.2, you can load JSON data located on another domain if you specify a JSONP callback, which can be done like so: "myurl?callback=?". jQuery automatically replaces the ? with the correct method name to call, calling your specified callback.

看了上面 JSONP的链接,几乎一无所获,按照其要求我加上了?callback=?",还是取不到任何数据,我的JS代码如下:

 

  1. $.getJSON("FetchAuthenticationTicketHandler.ashx?jsoncallback=?",  
  2.   
  3.     function(data) {  
  4.   
  5.         $("#divHeaderLink").html(data.name);  
  6.   
  7. });  

 

但是始终得不到数据,断点设到data.name一行,从来没有被执行过。于是,开始考察jsoncallback=?,发现这个其实是有值的,只是自己一直没有handle(其实是因为自己不知道怎么样handlegoogle很久,几乎没有找到任何直接使用ashx来处理remote json的例子),但是搜到一篇元老级的文章,是一篇专门介绍jquery ajax的文章,上面说需要将jsoncallback的值传回来,原来如此,于是就将ashx的方法修改了一下,几经转折,终于调试出来下面的代码:

 

  1. <%@ WebHandler Language="C#" Class="Handler" %>  
  2.   
  3. using System;  
  4. using System.Collections.Generic;  
  5. using System.Web;  
  6. using System.Web.Services;  
  7.   
  8. using System.Net.Json;  
  9.   
  10. ///   
  11. /// Summary description for $codebehindclassname$  
  12. ///   
  13. [WebService(Namespace = "http://tempuri.org/")]  
  14. [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]  
  15. public class Handler : IHttpHandler  
  16. {  
  17.   
  18.     public void ProcessRequest(HttpContext context)  
  19.     {  
  20.           
  21.          
  22.         context.Response.ContentType = "text/plain";  
  23.   
  24.         JsonObjectCollection collection = new JsonObjectCollection();  
  25.         collection.Add(new JsonStringValue("url""http://124.172.245.164:999/FTPImage_SpeInfoImage/2009/12/1/20091201173357_w200_h80_t1_i1.jpg"));  
  26.         collection.Add(new JsonStringValue("value""FTPImage_SpeInfoImage/2009/12/1/20091201173357_w200_h80_t1_i1_jpg"));  
  27.           
  28.         string str = context.Request.QueryString["jsoncallback"] + "(" + collection + ")";  
  29.         context.Response.Write(str);  
  30.     }  
  31.   
  32.   
  33.     public bool IsReusable  
  34.     {  
  35.         get  
  36.         {  
  37.             return false;  
  38.         }  
  39.     }  
  40. }  

 

 

其中,JsonObjectCollection 类要引用using System.Net.Json;JSON官方网站推荐的一个dll感觉也很不错。使用这个的好处是对于html代码的处理,因为json是通过“”传递数据的,但是html中也是含有“”的,如果直接手动拼写,会很麻烦。

这个ashx执行的结果如下:

jsonXXXXXXXXXXXXXX?其中 jsonXXXXXXXXXXXXXX 就是context.Request.QueryString["jsoncallback"的值。

 

 

 ---------------------

新浪调查结合json显示的柱状图。。 survey.rar

/Files/Fooo/survey.rar/Files/Fooo/EtWebSite.rar

 

E假旅游结合json显示图片加载时的Loading状态。。。

 /Files/Fooo/EtWebSite.rar

 

getJson的简单使用示例:

/Files/Fooo/JquerygetJSONdemo.rar

 

---------------------------------------------------------------------------------------

Avin补充:

重点:jsoncallback参数需要回传回来

本人使用php来调用

 

JS如下:

 

jq.getJSON("http://localhost:88/bags163_BCS/index.php/email_api/index?jsoncallback=?",function(json){
alert(json[1].catname);
});
 
PHP如下:
$arr = array (   
array (   
'catid' => '4',   
'catname' => 'klkjklj',   
'meta_title' => '招聘信息标题'  
),   
 
array (   
'catid' => '55',   
'catname' => 'php教程',   
'meta_title' => 'php教程标题',   
)   
);   
$jsonstr = json_encode($arr); 
 
$str = $_GET["jsoncallback"] . "(".$jsonstr.")";   
echo $str;

 

资讯评论
昵称:    Email:
首页 | 业务范围 | 建站套餐 | 成功案例 | 建站常识 | 网站推广 | 联系我们 | 网站地图 | 解决方案 | 技术博客
东莞网站开发,莞动力网络   莞动力网络     www.dgpower.net      Email:avinmo@163.com
  Copyright @ 2005 DGPOWER.ENT. All rights reserved.