jQuery调用WebService

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&#8221;>
<html xmlns=”http://www.w3.org/1999/xhtml&#8221;>
<head runat=”server”>
    
<title>无标题页 title>
    
<style type=”text/css”>
    input
    
{
        width
: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(
\r\n));
                }
            });
        });
    });
   

</
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>

千百度
© 版权声明
THE END
喜欢就支持一下吧
点赞9 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容