1、编写4种WebService方法
[WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [ScriptService] //令WebService成功传入Json参数,并以Json形式返回结果 [GenerateScriptType(typeof(Person))] //不是必要,但推荐添加(如果Person里面再嵌套另一个复杂类型,则必要声明) [ToolboxItem(false)] public class WebService1 : System.Web.Services.WebService { /// /// 无任何参数 /// /// [WebMethod] public string HelloWorld() { return "Hello World"; } /// /// 传入参数 /// /// /// [WebMethod] public string Hello(string name) { return string.Format("Hello {0}", name); } /// /// 返回泛型列表 /// /// /// [WebMethod] public List<int> CreateArray(int i) { List<int> list = new List<int>(); while (i >= 0) { list.Add(i--); } return list; } /// /// 返回复杂类型 /// /// /// /// [WebMethod] public Person GetPerson(string name, int age) { return new Person() { Name = name, Age = age }; } } /// /// 复杂类型 /// public class Person { public string Name { get; set; } public int Age { get; set; } }
2、编写js调用以上方法
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %> DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>无标题页title> <style type="text/css"> input { 200px; } style> <script type="text/javascript" src="jquery-1[1].2.6.min.js">script> <script type="text/javascript"> $(function(){ /* 1、WebService请求类型都为Post,WebService的Url为“[WebServiceUrl]/[WebMethod]” 2、contentType声明为Json 3、data要用Json的字符串格式传入 4、设置了dataType为json后,result就直接为返回的Json对象。 */ //调用无参数方法 $("#btnHelloWorld").click(function(){ $.ajax({ type: "POST", contentType:"application/json", url:"WebService1.asmx/HelloWorld", data:"{}", dataType:'json', success:function(result){ alert(result.d); } }); }); //传入1个参数 $("#btnHello").click(function(){ $.ajax({ type: "POST", contentType:"application/json", url:"WebService1.asmx/Hello", data:"{name:'KiMoGiGi'}", dataType:'json', success:function(result){ alert(result.d); } }); }); //返回泛型列表 $("#btnArray").click(function(){ $.ajax({ type: "POST", contentType:"application/json", url:"WebService1.asmx/CreateArray", data:"{i:10}", dataType:'json', success:function(result){ alert(result.d.join(" | ")); } }); }); //返回复杂类型 $("#btnPerson").click(function(){ $.ajax({ type: "POST", contentType:"application/json", url:"WebService1.asmx/GetPerson", data:"{name:'KiMoGiGi',age:26}", dataType:'json', success:function(result){ var person = result.d; var showText = []; for(var p in person){ showText.push(p + ":" + person[p]); } alert(showText.join(" ")); } }); }); }); script> head> <body> <form id="form1" runat="server"> <p> <input type="button" id="btnHelloWorld" value="HelloWorld" /> p> <p> <input type="button" id="btnHello" value="Hello" /> p> <p> <input type="button" id="btnArray" value="CreateArray" /> p> <p> <input type="button" id="btnPerson" value="GetPerson" /> p> form> body> html>