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 Div中加载其他页面的实现代码
Feb 27 Javascript
JS 树形递归实例代码
May 18 Javascript
js浮点数精确计算(加、减、乘、除)
Dec 26 Javascript
js控制鼠标事件移动及移出效果显示
Oct 19 Javascript
jQuery旋转插件jqueryrotate用法详解
Oct 13 Javascript
javascript 数组去重复(在线去重工具)
Dec 17 Javascript
Vue.js路由vue-router使用方法详解
Mar 20 Javascript
Vuejs 单文件组件实例详解
Feb 09 Javascript
JS中的JSON对象的定义和取值实现代码
May 09 Javascript
React Native基础入门之调试React Native应用的一小步
Jul 02 Javascript
VueJs里利用CryptoJs实现加密及解密的方法示例
Apr 29 Javascript
微信小程序按顺序同步执行的两种方式
Dec 20 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生成推广海报的方法分享
2018/04/22 PHP
jquery实现漂浮在网页右侧的qq在线客服插件示例
2013/05/13 Javascript
关闭页面window.location事件未执行的原因及解决方法
2014/09/01 Javascript
三种取消选中单选框radio的方法
2014/09/09 Javascript
使用node.js 获取客户端信息代码分享
2014/11/26 Javascript
教你使用javascript简单写一个页面模板引擎
2015/05/05 Javascript
常用原生JS兼容性写法汇总
2016/04/27 Javascript
JSON字符串和对象相互转换实例分析
2016/06/16 Javascript
headjs实现网站并行加载但顺序执行JS
2016/11/29 Javascript
详解网站中图片日常使用以及优化手法
2017/01/09 Javascript
详解为Bootstrap Modal添加拖拽的方法
2018/01/05 Javascript
vue进行图片的预加载watch用法实例讲解
2018/02/07 Javascript
React中使用UEditor百度富文本的方法
2018/08/22 Javascript
解决微信浏览器缓存站点入口文件(IIS部署Vue项目)
2019/06/17 Javascript
如何使用jQuery操作Cookies方法解析
2020/09/08 jQuery
跟老齐学Python之有容乃大的list(2)
2014/09/15 Python
python中ConfigParse模块的用法
2014/09/29 Python
在Python中使用__slots__方法的详细教程
2015/04/28 Python
Python实现图像几何变换
2015/07/06 Python
Python实现字典依据value排序
2016/02/24 Python
Python2与Python3的区别实例分析
2019/04/11 Python
python基于Selenium的web自动化框架
2019/07/14 Python
Python-Seaborn热图绘制的实现方法
2019/07/15 Python
Python Web版语音合成实例详解
2019/07/16 Python
提升Python效率之使用循环机制代替递归函数
2019/07/23 Python
python在不同条件下的输入与输出
2020/02/13 Python
快速解决Django关闭Debug模式无法加载media图片与static静态文件
2020/04/07 Python
Python内存映射文件读写方式
2020/04/24 Python
python else语句在循环中的运用详解
2020/07/06 Python
从零开始的TensorFlow+VScode开发环境搭建的步骤(图文)
2020/08/31 Python
美国顶级户外凉鞋品牌:Chacos
2017/03/27 全球购物
高中生自我鉴定范文
2013/10/30 职场文书
十八大报告观后感
2014/01/28 职场文书
2014年国培研修感言
2014/03/09 职场文书
社会体育专业大学生职业生涯规划书
2014/09/17 职场文书
师范生见习总结范文
2015/06/23 职场文书