文档章节

jQuery调用WebService

短短的歼击机
 短短的歼击机
发布于 2014/09/28 09:22
字数 483
阅读 153
收藏 9

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 {  getset; }

         public  int Age {  getset; }
    }

 


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

© 著作权归作者所有

上一篇: java socket
下一篇: socket.io
短短的歼击机

短短的歼击机

粉丝 82
博文 268
码字总数 269797
作品 0
武汉
高级程序员
私信 提问
加载中

评论(1)

Neoman
Neoman
为什么jquer调用啊
创建一个基于ASP.NET 2.0的JSON WebService

以前做的WebService基本都只是ASP.NET来调用,所以没考虑比较深入。今天有位JAVA的同事需要调用我的WebService,希望返回JSON类型的数据。原本以为是很简单的一个功能,真正做起来才发现在A...

长平狐
2012/11/06
2.3K
0
使用Rexsee、Jquery、PHP开发移动应用中的数据交互问题

Rexsee社区的一篇经验贴,转过来,主要是介绍数据交互这一块的实现,共同学习: 在开发某移动销售产品时,用户要求通过WebService调用进行数据交互。使用Rexsee,Jquery-mobile,PHP,WebServi...

yejiang
2012/05/22
137
0
怎样用WebService调用JQuery中的函数!

怎样用WebService调用JQuery中的函数!

李俊领
2011/04/18
773
4
如何通过PhoneGap调用C#的WebService?

我想通过在Java EE上搭建的PhoneGap中调用WebService,用的是Jquery Mobile Android框架,直接通过JS的方法来调用Webservice在Android模拟器上运行,结果不支持。请专家们、大神们告诉我怎么...

GGLoner
2014/01/06
2.1K
5
【jQuery】----jQuery 多个库之间的冲突 (二)

<!--在html引入js库--> <script type="text/javascript" src="jquery-1.10.1.js"/> <script type="text/javascript" src="base.js"/> <!--在html引入css样式文件--> <link rel="stylesheet" ......

LYQ1990
2017/09/12
8
0

没有更多内容

加载失败,请刷新页面

加载更多

读书笔记:深入理解ES6 (五)

第五章 解构:使数据访问更便捷 第1节 为什么使用解构功能?   在ES5中,开发者们从对象、数组中获取特定数据并赋值给变量,编写了很多看起来同质化的代码。例如: 1 let options = {2 ...

张森ZS
10分钟前
7
0
CentOS7 yum方式安装MySQL5.7

在CentOS中默认安装有MariaDB,这个是MySQL的分支,但为了需要,还是要在系统中安装MySQL,而且安装完成之后可以直接覆盖掉MariaDB。 1 下载并安装MySQL官方的 Yum Repository [root@localho...

roockee
18分钟前
6
0
Allegro三种自定义设置快捷键的方法

Allegro自定义设置快捷键的三种方法: 1、在Allegro PCB editor 命令窗口直接定义 2、通过修改用户变量env文件来设置快捷键 3、定义笔画为快捷键 1、在Allegro PCB editor 命令窗口直接定义 ...

demyar
22分钟前
6
0
如何做一张能让人眼前一亮的大屏?

作为在职场驰骋的社会人,提到数据可视化大家应该都不陌生了。数据可视化的作用也不用我多说,主要是利用图形化手段,更清晰直观地将数据展示。多层次、交互式的可视化分析能够方便决策者理解...

朕想上头条
23分钟前
4
0
TL138/1808/6748-EthEVM开发板硬件CPU、FLASH、RAM

TL138/1808/6748-EthEVM是广州创龙基于SOM-TL138/1808/6748核心板开发的一款开发板,具有三个网络接口。由于SOM-TL138/1808/6748核心板管脚兼容,所以此三个核心板共用同一个底板。开发板采用...

Tronlong创龙
28分钟前
7
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部