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 相关文章推荐
Ext.MessageBox工具类简介
Dec 10 Javascript
jquery遍历之parent()和parents()的区别及parentsUntil()方法详解
Dec 02 Javascript
跟我学习javascript的垃圾回收机制与内存管理
Nov 23 Javascript
浅谈javascript的call()、apply()、bind()的用法
Feb 21 Javascript
详解jQuery UI库中文本输入自动补全功能的用法
Apr 23 Javascript
vueJS简单的点击显示与隐藏的效果【实现代码】
May 03 Javascript
Mongoose学习全面理解(推荐)
Jan 21 Javascript
Angular.js实现获取验证码倒计时60秒按钮的简单方法
Oct 18 Javascript
Vuejs实现购物车功能
Nov 05 Javascript
vue-router beforeEach跳转路由验证用户登录状态
Dec 26 Javascript
微信小程序实现可长按移动控件
Nov 01 Javascript
jQuery实现手风琴特效
Jan 11 jQuery
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
Windows下XDebug 手工配置与使用说明
2010/07/11 PHP
php下利用curl判断远程文件是否存在的实现代码
2011/10/08 PHP
php file_get_contents抓取Gzip网页乱码的三种解决方法
2013/11/12 PHP
session 加入redis的实现代码
2016/07/15 PHP
PHP中md5()函数的用法讲解
2019/03/30 PHP
JavaScript 精粹读书笔记(1,2)
2010/02/07 Javascript
新发现一个骗链接的方法(js读取cookies)
2012/01/11 Javascript
基于jquery库的tab新形式使用
2012/11/16 Javascript
关于Jquery操作Cookie取值错误的解决方法
2013/08/26 Javascript
vue.js实现表格合并示例代码
2016/11/30 Javascript
微信小程序之picker日期和时间选择器
2017/02/09 Javascript
使用JS动态显示文本
2017/09/09 Javascript
使用Bootstrap4 + Vue2实现分页查询的示例代码
2017/12/21 Javascript
详解如何在vscode里面调试js和node.js的方法步骤
2018/12/24 Javascript
axios如何取消重复无用的请求详解
2019/12/15 Javascript
如何在postman测试用例中实现断言过程解析
2020/07/09 Javascript
[02:42]DOTA2英雄基础教程 杰奇洛
2013/12/23 DOTA
Python实现读取并保存文件的类
2017/05/11 Python
Python使用Selenium爬取淘宝异步加载的数据方法
2018/12/17 Python
详解Python3序列赋值、序列解包
2019/05/14 Python
python编写softmax函数、交叉熵函数实例
2020/06/11 Python
Django QuerySet查询集原理及代码实例
2020/06/13 Python
Matplotlib.pyplot 三维绘图的实现示例
2020/07/28 Python
Python colormap库的安装和使用详情
2020/10/06 Python
Pycharm 如何一键加引号的方法步骤
2021/02/05 Python
纯CSS3实现鼠标悬停提示气泡效果
2014/02/28 HTML / CSS
意大利大型购物中心:Oliviero.it
2017/10/19 全球购物
Java中的异常处理机制的简单原理和应用
2013/04/27 面试题
自我评价200字分享
2013/12/17 职场文书
司机辞职报告范文
2014/01/20 职场文书
先进集体事迹材料
2014/02/17 职场文书
2014年纪委工作总结
2014/12/05 职场文书
2015年纪委工作总结
2015/05/13 职场文书
初一语文教学反思
2016/03/03 职场文书
2016年区委书记抓基层党建工作公开承诺书
2016/03/25 职场文书
Python机器学习之底层实现KNN
2021/06/20 Python