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

来源：互联网发布：淘宝粘贴复制怎么弄编辑：程序博客网时间：2024/05/16 11:56

本人在网上找了很久，终于找到了一个关于.net使用jQuery的实例，这里介绍给初学者

jQuery调用页面后台方法‏如下：

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

.aspx

<%@ 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>

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]特性修饰