asp.net如何在前台利用jquery Ajax调用后台方法

一 ：最近因为帮同事开发项目使用到了asp.net,而我又想实现Ajax异步请求....从网上查询了一下资料之后，原来在asp.net中利用Ajax调用后台方法同样很简单，为了便于自己以后查看，特将此整理后记录如下

先贴上前台代码如下：

 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index.aspx.cs" Inherits="aspnetAjax.Index" %>

 <!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 %></title>
     <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
     <style type="text/css">
         td
         {
             text-align: center;
         }
     </style>
     <script type="text/javascript">
         $(function () {
             $("#but").attr("disabled", false);
         });
         //（全/反）选：
         function getChk() {
             if ($("#ch").attr("checked")) {
                 $(".chk").attr("checked", true);
             } else {
             $(".chk").attr("checked",false);
             }
         }
         //利用AJAX将数据发送到后台并判断数据选中情况方法：
         function sendData() {
             var sendValue = "";
             $(".chk").each(function (i,chk) {
                 if (chk.checked) {
                     sendValue += $.trim($(chk).parent().parent().find(".getData").text());
                     sendValue += ",";
                 }
             })
             if (sendValue.length == 0) {
                 alert("请选择需要传输的数据！！");
                 return;
             }
             sendValue = sendValue.substr(0, sendValue.length - 1);
             //开始ajax to asp.net：
             $.ajax({
                 type: "post",
                 contentType: "application/json",
                 url: "Index.aspx/GetAjaxValue",
                 data: "{sendValue:'" + sendValue + "'}",
                 beforeSend: function () {
                     $("#but").attr("disabled", true);
                 },
                 success: function (data) {
                     alert(data.d);
                 }, complete: function () { }, error: function () { }
             })
         }
     </script>
 </head>
 <body>
     <form id="form1" runat="server">
     <div>
         <table width="400px"; border="1px solid blue" cellpadding="0px" cellspacing="0px" style="border-color: Green; text-align:center">
             <tr>
                 <th>
                     全选<input type="checkbox" id="ch" onclick="getChk()" />
                 </th>
                 <th>
                     数据
                 </th>
             </tr>
             <tr>
                 <td>
                     <input type="checkbox" class="chk" />
                 </td>
                 <td class="getData">
                     1234
                 </td>
             </tr>
             <tr>
                 <td>
                     <input type="checkbox" class="chk" />
                 </td>
                 <td class="getData">
                    5678
                 </td>
             </tr>
             <tr>
                 <td>
                     <input type="checkbox" class="chk" />
                 </td>
                 <td class="getData">
                    12345678
                 </td>
             </tr>
             <tr>
                 <td>
                     <input type="checkbox" class="chk" />
                 </td>
                 <td class="getData">
                    87654321
                 </td>
             </tr>
         </table>
     </div>
     </form>
     <hr />
     <input type="button" id="but" onclick="sendData()" value="将选中的数据利用Ajax发送到后台" style=" background-color:#0080BB; cursor:pointer; border:1px solid #008094; border-radius:5px;" />
 </body>
 </html>

后台处理代码：

 using System;
 using System.Collections.Generic;
 using System.Linq;
 using System.Web;
 using System.Web.UI;
 using System.Web.UI.WebControls;
 using System.Web.Script.Serialization;
 using System.Web.Services;

 namespace aspnetAjax
 {
     public partial class Index : System.Web.UI.Page
     {
         public string title = "asp.net中使用Ajax";
         protected void Page_Load(object sender, EventArgs e)
         {

         }
         [WebMethod]
         public static string GetAjaxValue(string sendValue)
         {
             return sendValue;
         }
     }
 }

注意事项说明1：

注意事项说明二：

最终实现：

天气寒冷，就先写到这里....