Jauerymobile ajax跨域原理及案例

合集下载
  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 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方法,揭开秘密要来了: