前台页面:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication2.WebForm1" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script src="jquery-1.7.1.js"></script> <script type="text/javascript"> jQuery(function () { jQuery.ajax({ url: "http://localhost:1203/Handler1.ashx?callback=?", //jsonpCallback:callback, dataType: "jsonp", data: { name: "likong" }, success: function (result) { window.alert("姓名:" + result.name + ", 性别:" + result.gender); } }) function callback(){ window.alert("回调成功!"); } }) </script> </head> <body> </body> </html>
ashx文件代码:
using System; using System.Collections.Generic; using System.Linq; using System.Web; namespace WebApplication1 { /// <summary> /// Handler1 的摘要说明 /// </summary> public class Handler1 : IHttpHandler { public void ProcessRequest(HttpContext context) { string callback = context.Request.QueryString["callback"]; var name = context.Request.QueryString["name"]; string json = "{"name":"" + name + "","gender":"" + "男" + ""}"; //JSONP格式:回调函数名(json格式参数) //括号后不要加分号 string result = callback + "(" + json + ")"; context.Response.ContentType = "application/json"; context.Response.Write(result); } public bool IsReusable { get { return false; } } } }
前台代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication2.WebForm1" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script src="jquery-1.7.1.js"></script> <script type="text/javascript"> jQuery(function () { jQuery.ajax({ url: "http://localhost:1203/WebService1.asmx/GetGenderByName?callback=?", //jsonpCallback:callback, dataType: "jsonp", data: { name: "李空" }, success: function (result) { window.alert("姓名:" + ":" + result.name + ", 性别:" + result.gender); } }); function callback(){ window.alert("回调成功!"); } }) </script> </head> </html>
或者:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication2.WebForm1" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script src="jquery-1.7.1.js"></script> <script type="text/javascript"> jQuery(function () { jQuery.getJSON("http://localhost:1203/WebService1.asmx/GetGenderByName?callback=?&name=李空", function (result) { window.alert("姓名:" + ":" + result.name + ", 性别:" + result.gender); }, callback()) function callback(){ window.alert("回调成功!"); } }) </script> </head> </html>
Webservice代码:
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Services; using System.Web.Script.Serialization; using System.Data; namespace WebApplication1 { /// <summary> /// WebService1 的摘要说明 /// </summary> [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [System.ComponentModel.ToolboxItem(false)] // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,请取消注释以下行。 [System.Web.Script.Services.ScriptService] public class WebService1 : System.Web.Services.WebService { [WebMethod] public void GetGenderByName(string callback, string name) { string json = "{"name":"" + name + "","gender":"" + "男" + ""}"; string result = callback + "(" + json + ")"; HttpContext.Current.Response.ContentType = "application/json"; HttpContext.Current.Response.Write(result); HttpContext.Current.Response.End(); } } }
注释:测试Webservice是否调用成功,必须先运行Webservice页面!