//作者:Faneok
//日期:2012.06.14
//调用示例:
// <script language="javascript" type="text/javascript">
// function jsonpCallback(result) {//这里是回调方法
// alert(result.msg);
// $("ws1").remove();//注意回调后如果有可能请执行删除操作
// }
// $(function () {
// $.fn.getWS({ id: 'ws1', url: 'http://host:prot/ser.asmx/method', Callback: "jsonpCallback" });
// });
// </script>
//服务器端需要执行的操作示例:
//[WebMethod]
//public string method1()
//{
// string str = "{\"msg\":\"这里是主要内容\"}";
// if (HttpContext.Current.Request["jsonp"] != null)//这里是执行是否需要返回JSONP字符串的唯一标识
// {
// HttpRequest Request = HttpContext.Current.Request;
// HttpResponse Response = HttpContext.Current.Response;
// string callback = Request["jsonp"];
// Response.Write(callback + "(" + str + ")");
// Response.End();//结束后续的操作,直接返回所需要的字符串
// }
// return str;
//}
(function ($) {
//向目标DOM设置值,常规表单标签则直接设置Value,Item标签设置val属性
$.fn.getWS = function (options) {
var defaults = {
id: "",
url: "",
Callback: ""
}
var options = $.extend(defaults, options);
var oHead = document.getElementsByTagName('HEAD').item(0);
var oScript = document.createElement("script");
oScript.type = "text/javascript";
oScript.setAttribute("id", options.id);
oScript.src = options.url + "?jsonp=" + options.Callback;
oHead.appendChild(oScript);
}
})(jQuery);
一个简单的调用方法,Jquery原始方法:
$.ajax({
type: "get",
url: "http://localhost:17180/Service1.asmx/method1",
dataType: "jsonp",
jsonp: "jsonp", //传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(默认为:callback)
jsonpCallback: "jsonpCallback", //自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名
contentType: "application/json; charset=utf-8",
success: function (json) {
alert(json.msg);
},
error: function () {
debugger;
alert('fail');
}
});