jQuery调用WebService
web
Code<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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>Untitled Page</title>
<style type="text/css">
#btnHello
{
width: 94px;
}
#btnArray
{
width: 96px;
}
#btnPerson
{
width: 95px;
}
</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="JScript.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div>
<input type="button" id="btnHelloWorld" value="HelloWorld" />
</div>
<input type="button" id="btnHello" value="Hello" />
<div>
<input type="button" id="btnArray" value="CreateArray" />
</div>
<div>
<input type="button" id="btnPerson" value="GetPerson" />
</div>
</div>
</form>
</body>
</html>
Webservice
Codeusing System;
using System.Collections;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;
using System.Collections.Generic;
/// <summary>
/// Summary description for WebService
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
[System.Web.Script.Services.ScriptService]
[System.Web.Script.Services.GenerateScriptType(typeof(PersonInfo))]
public class WebService : System.Web.Services.WebService {
public WebService () {
//Uncomment the following line if using designed components
//InitializeComponent();
}
/// <summary>
/// 无任何参数
/// </summary>
/// <returns></returns>
[WebMethod]
public string SayHello()
{
return "Hello World";
}
/// <summary>
/// 传入参数
/// </summary>
/// <param name="name"></param>
/// <returns></returns>
[WebMethod]
public string SayHelloByName(string name)
{
return string.Format("{0} ,say hello", name);
}
/// <summary>
/// 返回泛型列表
/// </summary>
/// <param name="i"></param>
/// <returns></returns>
[WebMethod]
public List<int> CreateArray(int i)
{
List<int> list = new List<int>();
while (i >= 0)
{
list.Add(i--);
}
return list;
}
/// <summary>
/// 返回复杂类型
/// </summary>
/// <param name="name"></param>
/// <param name="age"></param>
/// <returns></returns>
[WebMethod]
public PersonInfo GetPersonInfo(string name, int age)
{
PersonInfo person = new PersonInfo();
person.Age = age;
person.Name = name;
return person;
}
}
/// <summary>
/// 复杂类型
/// </summary>
public class PersonInfo
{
public string Name { get; set; }
public int Age { get; set; }
}
JavaScript
Code//1、WebService请求类型都为Post，WebService的Url为“[WebServiceUrl]/[WebMethod]”
//2、contentType声明为Json
//3、data要用Json的字符串格式传入
//4、设置了dataType为json后，result就直接为返回的Json对象。
$(function()
{
//调用无参数
$("#btnHelloWorld").click(function(){
$.ajax({
type:"POST",
contentType:"application/json",
url:"WebService.asmx/SayHello",
data:"{}",
dataType:'json',
success:function(result){
alert(result.d);
}
});
});
//传入一个参数
$("#btnHello").click(function(){
$.ajax({
type:"POST",
contentType:"application/json",
url:"WebService.asmx/SayHelloByName",
data:"{name:'ike_li'}",
dataType:'json',
success:function(result){
alert(result.d);
}
});
});
//返回泛型列表
$("#btnArray").click(function(){
$.ajax({
type:"POST",
contentType:"application/json",
url:"WebService.asmx/CreateArray",
data:"{i:10}",
dataType:'json',
success:function(result){
alert(result.d.join(" | "));
}
});
});
//返回复杂类型
$("#btnPerson").click(function(){
$.ajax({
type:"POST",
contentType:"application/json",
url:"WebService.asmx/GetPersonInfo",
data:"{name:'ike_li',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("\r\n"));
}
});
});
});
浙公网安备 33010602011771号