Jquery异步请求数据实例代码


Posted in Javascript onDecember 28, 2011

一、Jquery向aspx页面请求数据
前台页面JS代码:

$("#Button1").bind("click", function () { 
$.ajax({ 
type: "post", 
url: "default.aspx", 
data: "name=" + $("#Text1").val(), 
success: function (result) { 
alert(result.msg); 
} 
}); 
});

<input id="Text1" type="text" value='张三'/> 
<input id="Button1" type="button" value="提交" />

后台cs代码:
protected void Page_Load(object sender, EventArgs e) 
{ 
if (Request["name"]!=null) 
{ 
Response.ContentType = "text/json"; 
Response.Write("{\"msg\":\""+Request["name"]+"\"}");//将数据拼凑为Json 
Response.End(); 
} 
}

二、Jquery向WebService页面请求数据
$("#Button2").bind("click", function () { 
$.ajax({ 
type: "post", 
contentType: "application/json", 
url: "WebService.asmx/HelloWorld", 
data: "{name:'" + $("#Text1").val() + "'}", 
datatype: "json", 
success: function (result) { 
alert(result.d); 
} 
}); 
}); 
<input id="Button2" type="button" value="向WebService提交" />

WebService代码
using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.Services; 
/// <summary> 
/// Summary description for WebService 
/// </summary> 
[WebService(Namespace = "http://tempuri.org/")] 
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] 
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 
[System.Web.Script.Services.ScriptService] 
public class WebService : System.Web.Services.WebService { 
public WebService () { 
//Uncomment the following line if using designed components 
//InitializeComponent(); 
} 
[WebMethod] 
public string HelloWorld( string name) { 
return "Hello World"+name; 
} 
}

三、Jquery向ashx请求数据和向页面相同
Js代码:
$("#Button3").bind("click", function () { 
$.ajax({ 
type: "post", 
url: "Handler.ashx", 
data: "name=" + $("#Text1").val(), 
success: function (result) { 
alert(result.msg); 
} 
}); 
});

后台代码:
<%@ WebHandler Language="C#" Class="Handler" %> 
using System; 
using System.Web; 
public class Handler : IHttpHandler { 
public void ProcessRequest (HttpContext context) { 
context.Response.ContentType = "text/json"; 
context.Response.Write("{\"msg\":\"Hello World"+context.Request["name"]+"来自handler.ashx\"}"); 
context.Response.End(); 
} 
public bool IsReusable { 
get { 
return false; 
} 
} 
}

代码下载
Javascript 相关文章推荐
javascript indexOf函数使用说明
Jul 03 Javascript
js变量以及其作用域详解
Jul 18 Javascript
谈谈Jquery ajax中success和complete有哪些不同点
Nov 20 Javascript
JS遍历ul下的li点击弹出li的索引的实现方法
Sep 19 Javascript
JavaScript判断浏览器对CSS3属性是否支持的多种方法
Nov 13 Javascript
Vue.js bootstrap前端实现分页和排序
Mar 10 Javascript
ES6入门教程之let和const命令详解
May 17 Javascript
BootStrap表单控件之文本域textarea
May 23 Javascript
详解在Vue中使用TypeScript的一些思考(实践)
Jul 06 Javascript
分享5个好用的javascript文件上传插件
Sep 16 Javascript
浅析JavaScript异步代码优化
Mar 18 Javascript
layui使用数据表格实现购物车功能
Jul 26 Javascript
javascript判断ie浏览器6/7版本加载不同样式表的实现代码
Dec 26 #Javascript
js使用函数绑定技术改变事件处理程序的作用域
Dec 26 #Javascript
JavaScript中的property和attribute介绍
Dec 26 #Javascript
JavaScript打字小游戏代码
Dec 26 #Javascript
js bind 函数 使用闭包保存执行上下文
Dec 26 #Javascript
js 函数调用模式小结
Dec 26 #Javascript
JavaScript 原型继承
Dec 26 #Javascript
You might like
一个可以兼容IE FF的加为首页与加入收藏实现代码
2009/11/02 Javascript
鼠标经过显示二级菜单js特效
2013/08/13 Javascript
JavaScript?Apple设备检测示例代码
2013/11/15 Javascript
jquery live()调用不存在的解决方法
2014/02/26 Javascript
一个不错的js html页面倒计时可精确到秒
2014/10/22 Javascript
jQuery实现调整表格单列顺序完整实例
2016/06/20 Javascript
如何实现星星评价(jquery.raty.js插件)
2016/12/21 Javascript
js实现倒计时效果(小于10补零)
2017/03/08 Javascript
认识less和webstrom的less配置方法
2017/08/02 Javascript
vue 实现 ios 原生picker 效果及实现思路解析
2017/12/06 Javascript
node实现登录图片验证码的示例代码
2018/04/20 Javascript
微信小程序控制台提示warning:Now you can provide attr &quot;wx:key&quot; for a &quot;wx:for&quot; to improve performance解决方法
2019/02/21 Javascript
vue.js实现会动的简历(包含底部导航功能,编辑功能)
2019/04/08 Javascript
vue+express+jwt持久化登录的方法
2019/06/14 Javascript
JavaScript中的null和undefined用法解析
2019/09/30 Javascript
微信小程序wx.getUserInfo授权获取用户信息(头像、昵称)的实现
2020/08/19 Javascript
WebStorm无法正确识别Vue3组合式API的解决方案
2021/02/18 Vue.js
[54:43]DOTA2-DPC中国联赛 正赛 CDEC vs Dynasty BO3 第一场 2月22日
2021/03/11 DOTA
python中__call__内置函数用法实例
2015/06/04 Python
Python 判断奇数偶数的方法
2018/12/20 Python
Python跳出多重循环的方法示例
2019/07/03 Python
PyCharm License Activation激活码失效问题的解决方法(图文详解)
2020/03/12 Python
python如何输出反斜杠
2020/06/18 Python
英国著名音像制品和图书游戏购物网站:Zavvi
2016/08/04 全球购物
加拿大拼图大师:Puzzle Master
2020/12/28 全球购物
业务员薪酬管理制度
2014/01/15 职场文书
委托公证书
2014/04/08 职场文书
先进个人评语大全
2015/01/04 职场文书
小学生手册家长意见
2015/06/03 职场文书
岁月神偷观后感
2015/06/11 职场文书
在职证明书模板
2015/06/15 职场文书
圣诞晚会主持词
2015/07/01 职场文书
2016年心理学教育培训学习心得体会
2016/01/12 职场文书
巾帼建功标兵先进事迹材料
2016/02/29 职场文书
MySQL8.0无法启动3534的解决方法
2021/06/03 MySQL
使用CSS实现一个搜索引擎的原理解析
2021/09/25 HTML / CSS