Jquery + Ajax调用webService实例代码(asp.net)


Posted in Javascript onAugust 27, 2010

webService中要实现ajax调用,则要加这句代码:
// 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,请取消对下行的注释。
[System.Web.Script.Services.ScriptService]
代码下载 /201008/yuanma/WebService2.rar

//无参数调用 
$(document).ready(function() { 
$('#btn1').click(function() { 
$.ajax({ 
type: "POST", //访问WebService使用Post方式请求 
contentType: "application/json", //WebService 会返回Json类型 
url: WebServiceURL + "WebService1.asmx/HelloWorld", //调用WebService的地址和方法名称组合 ---- WsURL/方法名 
data: "{}", //这里是要传递的参数,格式为 data: "{paraName:paraValue}",下面将会看到 
dataType: 'json', 
success: function(result) { //回调函数,result,返回值 
$('#dictionary').append(result.d); 
} 
}); 
}); 
}); //有参数调用 
$(document).ready(function() { 
$("#btn2").click(function() { 
$.ajax({ 
type: "POST", 
contentType: "application/json", 
url: WebServiceURL + "WebService1.asmx/GetWish", 
data: "{value1:'心想事成',value2:'万事如意',value3:'牛牛牛',value4:2009}", 
dataType: 'json', 
success: function(result) { 
$('#dictionary').append(result.d); 
} 
}); 
}); 
}); 
//返回集合(引用自网络,很说明问题) 
$(document).ready(function() { 
$("#btn3").click(function() { 
$.ajax({ 
type: "POST", 
contentType: "application/json", 
url: WebServiceURL + "WebService1.asmx/GetArray", 
data: "{i:10}", 
dataType: 'json', 
success: function(result) { 
$(result.d).each(function() { 
//alert(this); 
$('#dictionary').append(this.toString() + " "); 
//alert(result.d.join(" | ")); 
}); 
} 
}); 
}); 
}); 
//返回复合类型 
$(document).ready(function() { 
$('#btn4').click(function() { 
$.ajax({ 
type: "POST", 
contentType: "application/json", 
url: WebServiceURL + "WebService1.asmx/GetClass", 
data: "{}", 
dataType: 'json', 
success: function(result) { 
$(result.d).each(function() { 
//alert(this); 
$('#dictionary').append(this['ID'] + " " + this['Value']); 
//alert(result.d.join(" | ")); 
}); 
} 
}); 
}); 
}); 
//返回DataSet(XML) 
$(document).ready(function() { 
$('#btn5').click(function() { 
$.ajax({ 
type: "POST", 
url: WebServiceURL + "WebService1.asmx/GetDataSet", 
data: "{}", 
dataType: 'xml', //返回的类型为XML ,和前面的Json,不一样了 
success: function(result) { 
//演示一下捕获 
try { 
$(result).find("Table1").each(function() { 
$('#dictionary').append($(this).find("ID").text() + " " + $(this).find("Value").text()); 
}); 
} 
catch (e) { 
alert(e); 
return; 
} 
}, 
error: function(result, status) { //如果没有上面的捕获出错会执行这里的回调函数 
if (status == 'error') { 
alert(status); 
} 
} 
}); 
}); 
}); 

//Ajax 为用户提供反馈,利用ajaxStart和ajaxStop 方法,演示ajax跟踪相关事件的回调,他们两个方法可以添加给jQuery对象在Ajax前后回调 
//但对与Ajax的监控,本身是全局性的 
$(document).ready(function() { 
$('#loading').ajaxStart(function() { 
$(this).show(); 
}).ajaxStop(function() { 
$(this).hide(); 
}); 
});
Javascript 相关文章推荐
javascript 显示当前系统时间代码
Dec 28 Javascript
js过滤数组重复元素的方法
Sep 05 Javascript
js日历功能对象
Jan 12 Javascript
jquery分析文本里url或邮件地址为真实链接的方法
Jun 20 Javascript
javascript实现给定半径求出圆的面积
Jun 26 Javascript
使用ionic切换页面卡顿的解决方法
Dec 16 Javascript
关于vue编译版本引入的问题的解决
Sep 17 Javascript
Vuex 快速入门(简单易懂)
Sep 20 Javascript
Vue中遍历数组的新方法实例详解
Jul 21 Javascript
浅谈Vue项目骨架屏注入实践
Aug 05 Javascript
JQuery实现ul中添加LI和删除指定的Li元素功能完整示例
Oct 16 jQuery
浅谈Vue组件单元测试究竟测试什么
Feb 05 Javascript
JavaScript使用过程中需要注意的地方和一些基本语法
Aug 26 #Javascript
ExtJs GridPanel简单的增删改实现代码
Aug 26 #Javascript
javascript oop开发滑动(slide)菜单控件
Aug 25 #Javascript
JavaScript初学者需要了解10个小技巧
Aug 25 #Javascript
离开页面时检测表单元素是否被修改,提示保存的js代码
Aug 25 #Javascript
js中判断控件是否存在
Aug 25 #Javascript
JavaScript浏览器选项卡效果
Aug 25 #Javascript
You might like
PHP CURL模拟登录新浪微博抓取页面内容 基于EaglePHP框架开发
2012/01/16 PHP
php使用Cookie控制访问授权的方法
2015/01/21 PHP
Symfony2框架创建项目与模板设置实例详解
2016/03/17 PHP
PHP面试常用算法(推荐)
2016/07/22 PHP
小程序微信支付功能配置方法示例详解【基于thinkPHP】
2019/05/05 PHP
docker-compose部署php项目实例详解
2019/07/30 PHP
Alliance vs AM BO3 第二场2.13
2021/03/10 DOTA
微信中一些常用的js方法汇总
2015/03/12 Javascript
javascript实现五星评分功能
2015/11/10 Javascript
JS作为值的函数用法示例
2016/06/20 Javascript
js自制图片放大镜功能
2017/01/24 Javascript
Vue2.0权限树组件实现代码
2017/08/29 Javascript
用vue快速开发app的脚手架工具
2018/06/11 Javascript
vue+axios实现文件下载及vue中使用axios的实例
2018/09/21 Javascript
element-ui上传一张图片后隐藏上传按钮功能
2019/05/22 Javascript
Node.js API详解之 module模块用法实例分析
2020/05/13 Javascript
Vue全局使用less样式,组件使用全局样式文件中定义的变量操作
2020/10/21 Javascript
python解析html开发库pyquery使用方法
2014/02/07 Python
Python基于matplotlib绘制栈式直方图的方法示例
2017/08/09 Python
Python实现破解12306图片验证码的方法分析
2017/12/29 Python
对python requests发送json格式数据的实例详解
2018/12/19 Python
pyqt5 实现工具栏文字图片同时显示
2019/06/13 Python
python系列 文件操作的代码
2019/10/06 Python
Docker部署Python爬虫项目的方法步骤
2020/01/19 Python
详细分析Python可变对象和不可变对象
2020/07/09 Python
浅谈Python 钉钉报警必备知识系统讲解
2020/08/17 Python
瑜伽服装品牌:露露柠檬(lululemon athletica)
2017/06/04 全球购物
2014年三八妇女节活动总结
2014/03/01 职场文书
2014年资料员工作总结
2014/11/18 职场文书
会计继续教育培训心得体会
2016/01/19 职场文书
导游词之江南周庄
2019/12/06 职场文书
2020年个人安全保证书参考模板
2020/01/08 职场文书
写好Python代码的几条重要技巧
2021/05/21 Python
Python django中如何使用restful框架
2021/06/23 Python
Android开发之WECHAT微信小程序路由跳转的两种形式
2022/04/12 Java/Android
django项目、vue项目部署云服务器的详细过程
2022/07/23 Servers