jquery异步调用页面后台方法‏(asp.net)


Posted in Javascript onMarch 01, 2011
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JqueryCSMethodForm.aspx.cs" Inherits="JQuerWeb.JqueryCSMethodForm" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
<title></title> 
<script type="text/javascript" src="JS/jquery-1.4.2.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
$("input[type='button'][value='GetDate']").click(function() { 
$.ajax({ 
type: "post", 
url: "JqueryCSMethodForm.aspx/GetNowDate", 
datatype: "json", 
contentType: "application/json; charset=utf-8", 
success: function(data) { 
$("input#showTime").val(eval('(' + data.d + ')')[0].nowtime); 
}, 
error: function(XMLHttpRequest, textStatus, errorThrown) { 
alert(errorThrown); 
} 
}); 
}); 
$("input[type='button'][value='GetOneDayLater']").click(function() { 
$.ajax({ 
type: "post", 
url: "JqueryCSMethodForm.aspx/GetOneDayLate", 
data:"{days:1}", 
datatype: "json", 
contentType: "application/json; charset=utf-8", 
success: function(data) { 
$("input#showTime").val(eval('(' + data.d + ')')[0].nowtime); 
}, 
error: function(XMLHttpRequest, textStatus, errorThrown) { 
alert(errorThrown); 
} 
}); 
}); 
}); 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<input type="button" value="GetDate" /> 
<input type=button value="GetOneDayLater" /> 
<input type="text" id="showTime" /> 
</div> 
</form> 
</body> 
</html>

CS代码:
using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.UI; 
using System.Web.UI.WebControls; 
using System.Web.Services; 
namespace JQuerWeb 
{ 
public partial class JqueryCSMethodForm : System.Web.UI.Page 
{ 
protected void Page_Load(object sender, EventArgs e) 
{ 
} 
[WebMethod] 
public static String GetNowDate() 
{ 
return "[{\"nowtime\":\"" + DateTime.Now.ToShortDateString() + "\"}]"; 
} 
[WebMethod] 
public static String GetOneDayLate(Int32 days) 
{ 
return "[{\"nowtime\":\"" + DateTime.Now.AddDays(days).ToShortDateString() + "\"}]"; 
} 
} 
}

注意点:
(1) url的填写格式 url+"/method name"
(2) contentType: "application/json; charset=utf-8", 这个必须要有
(3) 返回数据的类型为json
(4) data:"{days:1}",参数的传递
(5) 后台的方法必须是public static 而且还要有 [WebMethod]特性修饰
Javascript 相关文章推荐
Javascript YUI 读码日记之 YAHOO.util.Dom - Part.3
Mar 22 Javascript
百度地图api应用标注地理位置信息(js版)
Feb 01 Javascript
HTML5之lang属性与dir属性的详解
Jun 19 Javascript
javascript实例分享---具有立体效果的图片特效
Jun 08 Javascript
javascript实现在线客服效果
Jul 15 Javascript
Javascript技术难点之apply,call与this之间的衔接
Dec 04 Javascript
jQuery实现ajax无刷新分页页码控件
Feb 28 Javascript
JS HTML图片显示Canvas 压缩功能
Jul 21 Javascript
基于wordpress的ajax写法详解
Jan 02 Javascript
支付宝小程序实现省市区三级联动
Jun 21 Javascript
vue项目,代码提交至码云,iconfont的用法说明
Jul 30 Javascript
Vue的Options用法说明
Aug 14 Javascript
jQuery获取文本节点之 text()/val()/html() 方法区别
Mar 01 #Javascript
jquery一句话全选/取消全选
Mar 01 #Javascript
基于jQuery的Tab选项框效果代码(插件)
Mar 01 #Javascript
jquery中实现标签切换效果的代码
Mar 01 #Javascript
IE图片缓存document.execCommand(&quot;BackgroundImageCache&quot;,false,true)
Mar 01 #Javascript
收集的10个免费的jQuery相册
Feb 26 #Javascript
jQuery 1.5.1 发布,全面支持IE9 修复大量bug
Feb 26 #Javascript
You might like
目录,文件操作详谈―PHP
2006/11/25 PHP
PHP 网页过期时间的控制代码
2009/06/29 PHP
如何使用“PHP” 彩蛋进行敏感信息获取
2013/08/07 PHP
PHP 读取文本文件内容并分页显示
2016/01/02 PHP
PHP中常用的数组操作方法笔记整理
2016/05/16 PHP
php利用递归实现删除文件目录的方法
2016/09/23 PHP
php实现的统计字数函数定义与使用示例
2017/07/26 PHP
php tpl模板引擎定义与使用示例
2019/08/09 PHP
正则表达式判断是否存在中文和全角字符和判断包含中文字符串长度
2008/09/27 Javascript
半角全角相互转换的js函数
2009/10/16 Javascript
利用js(jquery)操作Cookie的方法说明
2013/12/19 Javascript
javascript制作2048游戏
2015/03/30 Javascript
JavaScript使用Math.Min返回两个数中较小数的方法
2015/04/06 Javascript
Javascript监视变量变化的方法
2015/06/09 Javascript
基于JavaScript实现仿京东图片轮播效果
2015/11/06 Javascript
对象转换为原始值的实现方法
2016/06/06 Javascript
微信页面倒计时代码(解决safari不兼容date的问题)
2016/12/13 Javascript
Vue2.0实现将页面中表格数据导出excel的实例
2017/08/09 Javascript
详解React Native顶|底部导航使用小技巧
2017/09/14 Javascript
vue登录注册及token验证实现代码
2017/12/14 Javascript
vue.js前后端数据交互之提交数据操作详解
2018/04/24 Javascript
Bootstrap Table 双击、单击行获取该行及全表内容
2018/08/31 Javascript
详解基于Vue的支持数据双向绑定的select组件
2019/09/02 Javascript
vue.js实现照片放大功能
2020/06/23 Javascript
微信小程序实现星星评分效果
2020/11/01 Javascript
Python多线程同步Lock、RLock、Semaphore、Event实例
2014/11/21 Python
python SSH模块登录,远程机执行shell命令实例解析
2018/01/12 Python
解决python ogr shp字段写入中文乱码的问题
2018/12/31 Python
python matplotlib工具栏源码探析二之添加、删除内置工具项的案例
2021/02/25 Python
美国中小型企业领先的办公家具供应商:Office Designs
2016/11/26 全球购物
卡西欧B级产品官方网站:Casio Outlet
2018/05/22 全球购物
WebSphere 应用服务器都支持哪些认证
2013/12/26 面试题
年终奖发放方案
2014/06/02 职场文书
机械设计及其自动化专业求职信
2014/06/09 职场文书
2014年药店店长工作总结
2014/11/17 职场文书
导师对论文的学术评语
2015/01/04 职场文书