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设置与获取HTML,文本和值的简单实例
Feb 26 Javascript
基于javascript实现浏览器滚动条快到底部时自动加载数据
Nov 30 Javascript
微信小程序 WXDropDownMenu组件详解及实例代码
Oct 24 Javascript
微信小程序 数据绑定及运算的简单实例
Sep 20 Javascript
vue获取dom元素注意事项
Dec 28 Javascript
webpack项目调试以及独立打包配置文件的方法
Feb 28 Javascript
vue2.0页面前进刷新回退不刷新的实现方法
Jul 31 Javascript
electron-vue利用webpack打包实现多页面的入口文件问题
May 12 Javascript
JS中的算法与数据结构之栈(Stack)实例详解
Aug 20 Javascript
js blob类型url的视频下载问题的解决
Nov 29 Javascript
el-form 多层级表单的实现示例
Sep 10 Javascript
JS一分钟在github+Jekyll的博客中添加访问量功能的实现
Apr 03 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
实战mysql导出中文乱码及phpmyadmin导入中文乱码的解决方法
2010/06/11 PHP
PHP--用万网的接口实现域名查询功能
2012/12/13 PHP
解析php扩展php_curl.dll不加载的解决方法
2013/06/26 PHP
Thinkphp实现MySQL读写分离操作示例
2014/06/25 PHP
ThinkPHP让分页保持搜索状态的方法
2014/07/02 PHP
PHP SPL标准库之接口(Interface)详解
2015/05/11 PHP
ThinkPHP框架获取最后一次执行SQL语句及变量调试简单操作示例
2018/06/13 PHP
简单的php购物车代码
2020/06/05 PHP
javascript下给元素添加事件的方法与代码
2007/08/13 Javascript
理解Javascript_10_对象模型
2010/10/16 Javascript
关于JAVASCRIPT urldecode URL解码的问题
2012/01/08 Javascript
javascript模拟map输出与去除重复项的方法
2015/02/09 Javascript
Js可拖拽放大的层拖动特效实现方法
2015/02/25 Javascript
移除AngularJS下URL中的#字符的方法
2015/06/19 Javascript
vue实现简单实时汇率计算功能
2017/01/15 Javascript
AngularJs ng-change事件/指令的用法小结
2017/11/01 Javascript
详解tween.js 中文使用指南
2018/01/05 Javascript
element ui里dialog关闭后清除验证条件方法
2018/02/26 Javascript
对Vue- 动态元素属性及v-bind和v-model的区别详解
2018/08/27 Javascript
小程序云开发获取不到数据库记录的解决方法
2019/05/18 Javascript
JS手写一个自定义Promise操作示例
2020/03/16 Javascript
python del()函数用法
2013/03/24 Python
python查看FTP是否能连接成功的方法
2015/07/30 Python
python pcm音频添加头转成Wav格式文件的方法
2019/01/09 Python
如何安装并在pycharm使用selenium的方法
2020/04/30 Python
全球领先的在线cosplay服装商店:RoleCosplay
2020/01/18 全球购物
会计毕业自我鉴定
2014/02/05 职场文书
单位绩效考核方案
2014/05/11 职场文书
关于建议书的格式范文
2014/05/20 职场文书
计算机多媒体专业自荐信
2014/07/04 职场文书
中小学校园安全广播稿
2014/09/29 职场文书
离职感谢信怎么写
2015/01/22 职场文书
2015年办公室文秘工作总结
2015/04/30 职场文书
MySQL query_cache_type 参数与使用详解
2021/07/01 MySQL
Tomcat starup.bat 脚本实现开机自启动
2022/04/20 Servers
MySQL提取JSON字段数据实现查询
2022/04/22 MySQL