当前位置： 文江博客话题详情

jQuery异步调用页面后台实例分析

发布于 2022-09-11 19:58:52 字数 7848 浏览 14 评论 0

jQuery异步调用页面后台实例分析

本文列举了两个简单的例子，来介绍jQuery异步调用页面后台方法‏,方便大家学习和参考
jQuery调用页面后台方法‏如下：

给出了两个简单的例子，无参数的和有参数的，返回的都是json数据。

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JqueryCSMethodForm.aspx.cs" Inherits="JQuerWeb.JqueryCSMethodForm" %>  
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  3. <html xmlns="http://www.w3.org/1999/xhtml" >  
  4. <head runat="server">      
  5. <title></title>      
  6. <script type="text/javascript" src="JS/jquery-1.4.2.js"></script>           
  7. <script type="text/javascript">         
  8. $(document).ready(function() {              
  9. $("input[type='button'][value='GetDate']").click(function() {                  
  10. $.ajax({                     
  11. type: "post",                     
  12. url: "JqueryCSMethodForm.aspx/GetNowDate",                     
  13. datatype: "json",                     
  14. contentType: "application/json; charset=utf-8",                     
  15. success: function(data) {                          
  16. $("input#showTime").val(eval('(' + data.d + ')')[0].nowtime);                     
  17. },                     
  18. error: function(XMLHttpRequest, textStatus, errorThrown) {                          
  19. alert(errorThrown);                     
  20. }                 
  21. });              
  22. });            
  23. $("input[type='button'][value='GetOneDayLater']").click(function() {                  
  24. $.ajax({                     
  25. type: "post",                     
  26. url: "JqueryCSMethodForm.aspx/GetOneDayLate",                     
  27. data:"{days:1}",                     
  28. datatype: "json",                     
  29. contentType: "application/json; charset=utf-8",                     
  30. success: function(data) {                          
  31. $("input#showTime").val(eval('(' + data.d + ')')[0].nowtime);                     
  32. },                     
  33. error: function(XMLHttpRequest, textStatus, errorThrown) {                     
  34. alert(errorThrown);                     
  35. }                  
  36. });              
  37. });         
  38. });              
  39. </script>  
  40. </head>  
  41. <body>      
  42. <form id="form1" runat="server">      
  43. <div>         
  44. <input type="button" value="GetDate" />         
  45. <input type=button value="GetOneDayLater" />         
  46. <input type="text" id="showTime" />      
  47. </div>      
  48. </form>  </body>  </html>

复制代码CS代码：

  1. using System;  using System.Collections.Generic;  
  2. using System.Linq;  using System.Web;  
  3. using System.Web.UI;  
  4. using System.Web.UI.WebControls;  
  5. using System.Web.Services;  
  6. namespace JQuerWeb  {      
  7. public partial class JqueryCSMethodForm : System.Web.UI.Page      
  8. {                  
  9. protected void Page_Load(object sender, EventArgs e)         
  10. {                     
  11. }         
  12. [WebMethod]         
  13. public static String GetNowDate()         
  14. {              
  15. return "[{"nowtime":"" + DateTime.Now.ToShortDateString() + ""}]";         
  16. }         
  17. [WebMethod]         
  18. public static String GetOneDayLate(Int32 days)         
  19. {              
  20. return "[{"nowtime":"" + DateTime.Now.AddDays(days).ToShortDateString() + ""}]";         
  21. }      
  22. }  }

复制代码注意点：

(1) url的填写格式　url+"/method name"

(2) contentType: "application/json; charset=utf-8", 这个必须要有

(3) 返回数据的类型为json

(4) data:"{days:1}",参数的传递

(5) 后台的方法必须是public static 而且还要有 [WebMethod]特性修饰

原文链接：http://www.cnblogs.com/liyuxin/archive/2011/03/01/1967776.html

如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论， 你可以免费 注册 一个本站的账号。
列表为空，暂无数据

关于作者

橙幽之幻

暂无简介

文章
评论
26 人气
发私信

相关话题

更多

热门标签

操作系统 程序设计 IT运维 Linux系统管理 JavaScript 服务器应用 solaris C/C++ PHP Shell BSD Vue.js aix Oracle Python HTML 系统管理 HTML5 CSS 前端
更多

推荐作者

佚名

文章 0 评论 0

羁客

文章 0 评论 0

天天爱笑的徐老师

文章 0 评论 0

星

文章 0 评论 0

夏日落

文章 0 评论 0

隐诗

文章 0 评论 0

更多

友情链接

文江博客
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站，即表示您同意使用 Cookies 和您的相关数据。
    原文