Jauerymobile ajax跨域原理及案例
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
Jauerymobile ajax跨域原理及案例
一、$.getJSON()跨域之原理
/*可以跨域请求数据*/
其原理是对
服务端:
echo "jsonpCallback({data:'json data'})";
会弹出:json data
$.get(url, params, callback)
与$.post请求方法一样,只是请求类型不同
返回的是字符格式,可以用 $.evalJSON()方法进行转换格式
然后对JSON对象进行操作
$.getJSON(url, params, callback)
返回JSON对象,跨域示例如下:
1.
1.
2. function getdata()
3. {
4. $.getJSON(
5. "/payment/payment/paytest?callback=?",
6. {id:1,name:"name"},
7. function(jsondata){
8. alert(jsondata.json);
9. });
10. }
11.
12. 翻开jquery.的源码,一步步找:
13.
14. getJSON: function( url, data, callback ) {
15. return jQuery.get(url, data, callback, "json");
16. }
17.
18. 再找JQuery.get
19.
20. get: function( url, data, callback, type ) {
21. // shift arguments if data argument was omited
22.
23. if ( jQuery.isFunction( data ) ) {
24. type = type || callback;
25. callback = data;
26. data = null;
27. }
28.
29. return jQuery.ajax({
30. type: "GET",
31. url: url,
32. data: data,
33. success: callback,
34. dataType: type
35. });
36. }
37.
38. 再找 jQuery.ajax
39.
40. jQuery.ajax({
41. url: url,
42. type: type,
43. dataType: "html",
44. data: params,
45. complete: function( res, status ) {
46. // If successful, inject the HTML into all the matched elements
47. if ( status === "success" || status === "notmodified" ) {
48. // See if a selector was specified
49. self.html( selector ?
50. // Create a dummy div to hold the results
51. jQuery("
")52. // inject the contents of the document in, removing the scripts
53. // to avoid any 'Permission Denied' errors in IE
54. .append(res.responseText.replace(rscript, ""))
55.
56. // Locate the specified elements
57. .find(selector) :
58.
59. // If not, just inject the full result
60. res.responseText );
61. }
62.
63. if ( callback ) {
64. self.each( callback, [res.responseText, status, res] );
65. }
66. }
67. });
68.
69. return this;
70. }
71.
72. 再找ajax方法,揭开秘密要来了: