jquery调用asp.net 页面后台的实现代码


Posted in Javascript onApril 27, 2011

先创建一个aspx页面编写一个客户端控件<input type="button" id="AjaxDemo"
value="AjaxDemo">
再aspx后台的页面编写一个简单的方法,代码如下:

[WebMethod] 
public static string ABC(string ABC) 
{ 
return ABC; 
}

必须声明为静态方法,并且它们必须使用 [WebMethod] 特性标注。但是在webservice里面不必是静态方法,它的对象可以是list、dataset、class对象等……
接下来就应该考虑怎么让前台的客户端控件调用到后台的方法了..这时jqury登场了..
在页面引入jquery类库
<script type="text/javascript"
src="JQuery/jquery-1.3.2-vsdoc2.js"></script>
在页面添加脚本代码如下:
<script type="text/javascript"> 
$().ready( function() { 
$("#AjaxDemo").click(function() { 


$.ajax({ 
type: "POST", 




url: "Default.aspx/ABC", 
data: "{'ABC':'test'}", 
contentType: "application/json; charset=utf-8", 
success: function(msg) {alert(msg); } 
}) 
}) 
} 
) 
</script >

这样就大功告成了!很多事情都是jquery类库帮我们做完了,我们这里讨论的是如何用,具体里面怎么实现,我们不关心!
jquery里还有很多像$.ajax这样的方法提供给我们使用.大家可以试试!
补充:注意要建3.5的项目,如果是2.0的话。配置文件会少很多引用的,如果你建的是2.0项目的话。建个3.5的。把3.5的配置文件覆盖到2.0的项目即可!
上面的代码如果成功之后弹出的是"{d:test}",是因为他返回的是字符串,我们可以将他改成返回json对象.
把jquery代码修改如下
$().ready( 
function() { 
$("#AjaxDemo").click(function() { 
$.ajax({ 
type: "POST", 



url: "Default.aspx/ABC", 
data: "{'ABC':'test'}", 
dataType: "json", 
contentType: "application/json; charset=utf-8", 
success: function(msg) {alert(msg.d); } 
}) 
}) 
} 
}

我们设置他返回的数据是json对象,现在我们可以用返回的json对象,根据弹出来的d:test,我们可以很明显看到key是d,值是test,那我们利用返回的数据msg对象直接点d,就可以获得test的,修改了代码之后.现在弹出来就是test了..
Javascript 相关文章推荐
css把超出的部分显示为省略号的方法兼容火狐
Jul 23 Javascript
js option删除代码集合
Nov 12 Javascript
DOM和XMLHttpRequest对象的属性和方法整理
Jan 04 Javascript
JavaScript版DateAdd和DateDiff函数代码
Mar 01 Javascript
javascript中方便增删改cookie的一个类
Oct 11 Javascript
防止按钮在短时间内被多次点击的方法
Mar 10 Javascript
Jquery实现地铁线路指示灯提示牌效果的方法
Mar 02 Javascript
jquery右下角自动弹出可关闭的广告层
May 08 Javascript
理解javascript中try...catch...finally
Dec 25 Javascript
基于react框架使用的一些细节要点的思考
May 31 Javascript
Angular 4.X开发实践中的踩坑小结
Jul 04 Javascript
Vue.js路由实现选项卡简单实例
Jul 24 Javascript
jQuery Ajax方法调用 Asp.Net WebService 的详细实例代码
Apr 27 #Javascript
Javascript实现仿WebQQ界面的“浮云”兼容 IE7以上版本及FF
Apr 27 #Javascript
js,jQuery 排序的实现代码,网页标签排序的实现,标签排序
Apr 27 #Javascript
javascript中的继承实例代码
Apr 27 #Javascript
各浏览器对link标签onload/onreadystatechange事件支持的差异分析
Apr 27 #Javascript
仅IE9/10同时支持script元素的onload和onreadystatechange事件分析
Apr 27 #Javascript
js实时监听文本框状态的方法
Apr 26 #Javascript
You might like
PHP显示今天、今月、上月、今年的起点/终点时间戳的代码
2011/05/25 PHP
php判断一个数组是否为有序的方法
2015/03/27 PHP
PHP内核探索之解释器的执行过程
2015/12/22 PHP
必须收藏的23个php实用代码片段
2016/02/02 PHP
JS实现QQ图片一闪一闪的效果小例子
2013/07/31 Javascript
js中符号转意问题示例探讨
2013/08/19 Javascript
javascript实用小函数使用介绍
2013/11/11 Javascript
Js判断CSS文件加载完毕的具体实现
2014/01/17 Javascript
jQuery实用技巧必备(中)
2015/11/03 Javascript
学习JavaScript设计模式之状态模式
2016/01/08 Javascript
JavaScript 事件对内存和性能的影响
2017/01/22 Javascript
BootStrap点击保存后实现模态框自动关闭的思路(模态框)
2017/09/26 Javascript
vue 实现类似淘宝星级评分的示例
2018/03/01 Javascript
解析Json字符串的三种方法日常常用
2018/05/02 Javascript
详解angular脏检查原理及伪代码实现
2018/06/08 Javascript
利用d3.js实现蜂巢图表带动画效果
2019/09/03 Javascript
vue使用keep-alive实现组件切换时保存原组件数据方法
2020/10/30 Javascript
[00:15]天涯墨客终极技能展示
2018/08/25 DOTA
[00:52]玛尔斯技能全介绍
2019/03/06 DOTA
[51:52]Liquid vs Secret 2019国际邀请赛淘汰赛 败者组 BO3 第二场 8.24
2019/09/10 DOTA
Python使用PIL模块生成随机验证码
2017/11/21 Python
windows10下python3.5 pip3安装图文教程
2018/04/02 Python
python3+PyQt5重新实现QT事件处理程序
2018/04/19 Python
创建pycharm的自定义python模板方法
2018/05/23 Python
python文件写入write()的操作
2019/05/14 Python
使用浏览器访问python写的服务器程序
2019/10/10 Python
pytorch 图像中的数据预处理和批标准化实例
2020/01/15 Python
多视角3D逼真HTML5水波动画
2016/03/03 HTML / CSS
新秀丽官方旗舰店:Samsonite拉杆箱、双肩包、皮具
2018/03/05 全球购物
德国汽车零件和汽车配件网上商店:kfzteile24
2018/11/14 全球购物
Java程序员面试90题
2013/10/19 面试题
英语系毕业生自荐信
2013/10/31 职场文书
校运会广播稿100字
2014/01/27 职场文书
工程造价专业大学生职业规划范文
2014/03/09 职场文书
三年级学生期末评语
2014/12/26 职场文书
幼儿园感恩节活动总结
2015/03/24 职场文书