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 相关文章推荐
js实现ArrayList功能附实例代码
Oct 29 Javascript
jquery实现图片上传之前预览的方法
Jul 11 Javascript
jQuery的remove()方法使用详解
Aug 11 Javascript
JavaScript原型及原型链终极详解
Jan 04 Javascript
jQuery获取select选中的option的value值实现方法
Aug 29 Javascript
BootStrap3中模态对话框的使用
Jan 06 Javascript
微信小程序 封装http请求实例详解
Jan 16 Javascript
BootStrap注意事项小结(五)表单
Mar 10 Javascript
vue proxyTable 接口跨域请求调试的示例
Sep 12 Javascript
jQuery中的$是什么意思及 $. 和 $().的区别
Apr 20 jQuery
使用express获取微信小程序二维码小记
May 21 Javascript
vue2之简易的pc端短信验证码的问题及处理方法
Jun 03 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循环语句 for()与foreach()用法区别介绍
2012/09/05 PHP
PHP中PDO事务处理操作示例
2018/05/02 PHP
Laravel框架定时任务2种实现方式示例
2018/12/08 PHP
javascript中直接写php代码的方法
2013/07/31 Javascript
jquery仅用6行代码实现滑动门效果
2015/09/07 Javascript
【JS+CSS3】实现带预览图幻灯片效果的示例代码
2016/03/17 Javascript
JavaScript实现页面跳转的方式汇总
2016/05/16 Javascript
jQuery实现table中的tr上下移动并保持序号不变的实例代码
2016/07/11 Javascript
ECMAScript6轮播图实践知识总结
2016/08/17 Javascript
关于webpack代码拆分的解析
2017/07/20 Javascript
JS非空验证及邮箱验证的实例
2017/08/11 Javascript
javascript获取指定区间范围随机数的方法
2017/09/08 Javascript
解决微信小程序中转换时间格式IOS不兼容的问题
2019/02/15 Javascript
vue中 this.$set的用法详解
2019/09/06 Javascript
nuxt框架中对vuex进行模块化设置的实现方法
2019/09/06 Javascript
原生JS无缝滑动轮播图
2019/10/22 Javascript
Django项目中用JS实现加载子页面并传值的方法
2018/05/28 Python
Python实现将通信达.day文件读取为DataFrame
2018/12/22 Python
python删除列表元素的三种方法(remove,pop,del)
2019/07/22 Python
在Python中等距取出一个数组其中n个数的实现方式
2019/11/27 Python
Python面向对象程序设计之类和对象、实例变量、类变量用法分析
2020/03/23 Python
Pycharm 如何一键加引号的方法步骤
2021/02/05 Python
html5模拟平抛运动(模拟小球平抛运动过程)
2013/07/25 HTML / CSS
使用phonegap创建联系人的实现方法
2017/03/30 HTML / CSS
职业生涯规划怎么写
2013/12/29 职场文书
校园餐饮创业计划书
2014/01/10 职场文书
运动会邀请函范文
2014/01/31 职场文书
《识字五》教学反思
2014/03/01 职场文书
大学生个人求职信
2014/06/02 职场文书
大学生社会实践活动总结
2014/07/03 职场文书
加强作风建设演讲稿
2014/10/24 职场文书
党的群众路线专项整治方案
2014/11/03 职场文书
员工年终考核评语
2014/12/31 职场文书
2016年七夕情人节宣传语
2015/11/25 职场文书
MySQL索引是啥?不懂就问
2021/07/21 MySQL
Spring Cloud 中@FeignClient注解中的contextId属性详解
2021/09/25 Java/Android