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 相关文章推荐
jQuery学习总结之元素的相对定位和选择器(持续更新)
Apr 26 Javascript
window.location.reload()方法刷新页面弹出要再次显示该网页对话框
Apr 24 Javascript
jQuery插件kinMaxShow扩展效果用法实例
May 04 Javascript
jquery实现不包含当前项的选择器实例
Jun 25 Javascript
浅谈javascript中的DOM方法
Jul 16 Javascript
JavaScript+html5 canvas制作的百花齐放效果完整实例
Jan 26 Javascript
基于jQuery实现仿QQ空间送礼物功能代码
May 24 Javascript
JS实现漂亮的时间选择框效果
Aug 20 Javascript
JS获取多维数组中相同键的值实现方法示例
Jan 06 Javascript
浅谈VUE单页应用首屏加载速度优化方案
Aug 28 Javascript
vue学习笔记之作用域插槽实例分析
Feb 01 Javascript
JS实现京东商品分类侧边栏
Dec 11 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
phpadmin如何导入导出大数据文件及php.ini参数修改
2013/02/18 PHP
php数据类型判断函数有哪些
2013/09/23 PHP
php实现httpclient类示例
2014/04/08 PHP
php函数serialize()与unserialize()用法实例
2014/11/06 PHP
php 魔术方法详解
2014/11/11 PHP
php如何控制用户对图片的访问 PHP禁止图片盗链
2016/03/25 PHP
YII框架学习笔记之命名空间、操作响应与视图操作示例
2019/04/30 PHP
document.body.scrollTop 值总为0的解决方法 比较常见的标准问题
2009/11/30 Javascript
js页面滚动时层智能浮动定位实现(jQuery/MooTools)
2011/08/23 Javascript
JS返回上一页实例代码通过图片和按钮分别实现
2013/08/16 Javascript
JQuery处理json与ajax返回JSON实例代码
2014/01/03 Javascript
document.forms用法示例介绍
2014/06/26 Javascript
Node.js事件循环(Event Loop)和线程池详解
2015/01/28 Javascript
js实现鼠标经过时图片滚动停止的方法
2015/02/16 Javascript
jQuery实现判断滚动条到底部
2015/06/23 Javascript
jQuery简单实现仿京东商城的左侧菜单效果代码
2015/09/09 Javascript
基于Bootstrap漂亮简洁的CSS3价格表(附源码下载)
2017/02/28 Javascript
基于HTML5+JS实现本地图片裁剪并上传功能
2017/03/24 Javascript
详解express + mock让前后台并行开发
2018/06/06 Javascript
[01:02:34]TFT vs VGJ.T Supermajor 败者组 BO3 第二场 6.5
2018/06/06 DOTA
Python操作串口的方法
2015/06/17 Python
Python 实现 贪吃蛇大作战 代码分享
2016/09/07 Python
Python 中pandas.read_excel详细介绍
2017/06/23 Python
Python3 安装PyQt5及exe打包图文教程
2019/01/08 Python
python实现在线翻译功能
2020/03/03 Python
python中JWT用户认证的实现
2020/05/18 Python
HTML5 创建canvas元素示例代码
2014/06/04 HTML / CSS
捷克建筑材料网上商店:DEK.cz
2021/03/06 全球购物
校园创业策划书
2014/01/14 职场文书
财会专业毕业生自荐信
2014/07/09 职场文书
班主任寄语2015
2015/02/26 职场文书
小学生心理健康活动总结
2015/05/08 职场文书
宿舍管理制度范本
2015/08/07 职场文书
教师网络培训心得体会
2016/01/09 职场文书
MySQL 分组查询的优化方法
2021/05/12 MySQL
MySQL优化之慢日志查询
2022/06/10 MySQL