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 相关文章推荐
运用Windows XP附带的Msicuu.exe、Msizap.exe来彻底卸载顽固程序
Apr 21 Javascript
THREE.JS入门教程(2)着色器-上
Jan 24 Javascript
js验证输入是否为手机号码或电话号码示例
Dec 30 Javascript
JS实现的自定义水平滚动字体插件完整实例
Jun 17 Javascript
Angular2 多级注入器详解及实例
Oct 30 Javascript
jQuery实现手机上输入后隐藏键盘功能
Jan 04 Javascript
JS实现的添加弹出层并完成锁屏操作示例
Apr 07 Javascript
分享vue.js devtools遇到一系列问题
Oct 24 Javascript
vue使用echarts图表的详细方法
Oct 22 Javascript
angular多语言配置详解
May 16 Javascript
JavaScript 预解析的4种实现方法解析
Sep 03 Javascript
小程序使用分包的示例代码
Mar 23 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执行速率优化技巧小结
2008/03/15 PHP
非常好用的两个PHP函数 serialize()和unserialize()
2012/02/04 PHP
smarty自定义函数用法示例
2016/05/20 PHP
PHP输出Excel PHPExcel的方法
2018/07/26 PHP
如何在Web页面上直接打开、编辑、创建Office文档
2007/03/12 Javascript
JS判断是否为数字,是否为整数,是否为浮点数的代码
2010/04/24 Javascript
js中arguments的用法(实例讲解)
2013/11/30 Javascript
jQuery实现table隔行换色和鼠标经过变色的两种方法
2014/06/15 Javascript
javascript实现微信分享
2014/12/23 Javascript
Javascript中For In语句用法实例
2015/05/14 Javascript
JavaScript中的操作符类型转换示例总结
2016/05/30 Javascript
JS中常用的输出方式(五种)
2016/06/12 Javascript
AngularJS应用开发思维之依赖注入3
2016/08/19 Javascript
详解jquery easyui之datagrid使用参考
2016/12/05 Javascript
前端页面文件拖拽上传模块js代码示例
2017/05/19 Javascript
Vue实现动态显示textarea剩余字数
2017/05/22 Javascript
Angular实现的简单查询天气预报功能示例
2017/12/27 Javascript
详解从买域名到使用pm2部署node.js项目全过程
2018/03/07 Javascript
微信小程序CSS3动画下拉菜单效果
2018/11/04 Javascript
mongodb初始化并使用node.js实现mongodb操作封装方法
2019/04/02 Javascript
JavaScript运动原理基础知识详解
2020/04/02 Javascript
简单了解three.js 着色器材质
2020/08/03 Javascript
[03:36]2014DOTA2 TI小组赛综述 八强诞生进军钥匙球馆
2014/07/15 DOTA
python用来获得图片exif信息的库实例分析
2015/03/16 Python
深入讨论Python函数的参数的默认值所引发的问题的原因
2015/03/30 Python
Python使用MYSQLDB实现从数据库中导出XML文件的方法
2015/05/11 Python
Python实现七彩蟒蛇绘制实例代码
2018/01/16 Python
python自动化报告的输出用例详解
2018/05/30 Python
快速解决vue.js 模板和jinja 模板冲突的问题
2019/07/26 Python
Python基于BeautifulSoup爬取京东商品信息
2020/06/01 Python
英语专业应届生求职信范文
2013/11/15 职场文书
2014年幼儿园国庆主题活动方案
2014/09/16 职场文书
导游词之岳阳楼
2019/09/25 职场文书
Python 使用 Frame tkraise() 方法在 Tkinter 应用程序中的Frame之间切换
2022/04/24 Python
Rust中的Struct使用示例详解
2022/08/14 Javascript