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 相关文章推荐
Jquery选择器 $实现原理
Dec 02 Javascript
node.js使用nodemailer发送邮件实例
Mar 10 Javascript
用js替换除数字与逗号以外的所有字符的代码
Jun 07 Javascript
使用js复制链接中的部分文字的方法
Jul 30 Javascript
AngularJS中的$watch(),$digest()和$apply()区分
Apr 04 Javascript
JS防止网页被嵌入iframe框架的方法分析
Sep 13 Javascript
微信小程序 教程之WXML
Oct 18 Javascript
node.js连接MongoDB数据库的2种方法教程
May 17 Javascript
vue中 this.$set的用法详解
Sep 06 Javascript
js实现GIF动图分解成多帧图片上传
Oct 24 Javascript
ES6的循环与可迭代对象示例详解
Jan 31 Javascript
详解Node.js如何处理ES6模块
May 15 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
javascript,php获取函数参数对象的代码
2011/02/03 PHP
关于php循环跳出的问题
2013/07/01 PHP
php实现查询百度google收录情况(示例代码)
2013/08/02 PHP
PHP采用XML-RPC构造Web Service实例教程
2014/07/16 PHP
总结的一些PHP开发中的tips(必看篇)
2017/03/24 PHP
php 截取中英文混合字符串的方法
2018/05/31 PHP
Laravel 连接(Join)示例
2019/10/16 PHP
从盛大通行证上摘下来的身份证验证js代码
2011/01/11 Javascript
九种js弹出对话框的方法总结
2013/03/12 Javascript
javaScript中的this示例学习详解及工作原理
2014/01/13 Javascript
javascript移出节点removeChild()使用介绍
2014/04/03 Javascript
javascript中使用正则计算中文长度的例子
2014/04/29 Javascript
使用jQuery的toggle()方法对HTML标签进行显示、隐藏的方法(示例)
2016/09/01 Javascript
JavaScript表单验证开发
2016/11/23 Javascript
jquery实现左右轮播图效果
2017/09/28 jQuery
jquery中有哪些api jQuery主要API
2017/11/20 jQuery
解析Angular 2+ 样式绑定方式
2018/01/15 Javascript
vue中使用mxgraph的方法实例代码详解
2019/05/17 Javascript
vue canvas绘制矩形并解决由clearRec带来的闪屏问题
2019/09/02 Javascript
p5.js实现故宫橘猫赏秋图动画
2019/10/23 Javascript
Vue的状态管理vuex使用方法详解
2020/02/05 Javascript
javascript实现滚轮轮播图片
2020/12/13 Javascript
python写日志文件操作类与应用示例
2019/07/01 Python
对Python函数设计规范详解
2019/07/19 Python
Python通过4种方式实现进程数据通信
2020/03/12 Python
pymysql模块使用简介与示例
2020/11/17 Python
python实现登录与注册系统
2020/11/30 Python
Python 可视化神器Plotly详解
2020/12/26 Python
K近邻法(KNN)相关知识总结以及如何用python实现
2021/01/28 Python
将"引用"作为函数返回值类型的格式、好处和需要遵守的规则
2016/02/09 面试题
山海经纬软件测试笔试题和面试题
2013/04/02 面试题
善意的谎言事例
2014/02/15 职场文书
社区工作者演讲稿
2014/05/23 职场文书
行政文员实习自我鉴定范文
2014/09/14 职场文书
环境工程专业毕业生求职信
2014/09/30 职场文书
职代会闭幕词
2015/01/28 职场文书