jquery中ajax方法怎样通过JSONP进行远程调用.pdfVIP

j query中的aj ax⽅法怎样通过JSONP进⾏远程调⽤ 关于JSONP的概念和为什么要使⽤JSONP ⽹上已经有很多教程，这⼀节主要演⽰下在 JQUERY 中的aj ax 法怎样通过JSONP进⾏远程调⽤ ⾸先介绍下$.aj ax 的参数： type ：请求 式 GET/POST url:请求地址 async:布尔类型，默认为true 表⽰请求是否为异步，如果为false表⽰为同步。 dataType ：返回的数据类型 j sonp ：传递给请求处理程序或页⾯的，⽤以获得j sonp 回调函数名的参数名⼀般默认 为:callback) j sonpCallback ：⾃定义的j sonp 回调函数名称，默认为j Query ⾃动⽣成的随机函数名， 也可以写? ，j Query会⾃动为你处理数据 success ：调⽤成功执⾏的函数 error ：异常处理函数 1.⽰例1 服务器端我们采⽤MVC的ACTION来返回数据 代码如下: public class HomeController : Controller { // // GET : /Home/ public ActionResult Index() { returnVie (); } public ActionResult ReturnJson() { string callback = Request.QueryString[callback]; string json = {name:张三,age:20}; string result = string.Format({0}({1}), callback, json); returnContent(result); } } 客户端使⽤j sonp来传输数据 代码如下: @{ Vie Bag.Title = Index; Layout = ~/Vie s/Shared/_Layout.csht script src=~/Scripts/jquery-1.7.1.min.jstype=text/javascript script type=text/javascript functionSendData() { $.ajax({ type: get, async: false, url: /home/ReturnJson, dataType: jsonp, success: function(data){ alert(); }, error: function(){ alert(fail); } }); } /script input type=button value=提交 onclick=SendData();/ 点击提交按钮后，发现服务器端的Request .QueryString[callback ]返回⼀个随机函数 名。这样就被设置成JSONP格式来传递数据了 2. ⾃定义函数名 可以在传递过程中⾃定义函数名，只要使⽤j sonpCallback参数就可以了。 j sonp:表⽰传递的参数，默认为callback ，我们也可以⾃定义，服务器段通过此参数， 获取⾃定义的函数名称，服务器这样获取 Request .QueryString[callback ] j sonpCallback表⽰传递的参数值，也就是回调的函数名称，这是⾃定义的名称。 代码如下: script type=text/javascript functionSendData() { $.ajax({ type: get, async: false, url: /home/ReturnJson, dataType: jsonp, jsonp: callback,//传递给请求处理程序或⻚⾯的，⽤以获得jsonp回调函数名的 jsonpCallback: receive,//⾃定义的jsonp回调函数名称，默 为jQuery⾃动 success: function(data) { alert(); }, error: function() { alert(fail); } }); } functionreceive(data) { alert(data.age