• jQuery 调用后台方法(net)


      1 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
      2 
      3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      4 
      5 <html xmlns="http://www.w3.org/1999/xhtml">
      6 <head runat="server">
      7     <title>无标题页</title>
      8     <style type="text/css">
      9    
     10      .hover
     11         {
     12             cursor: pointer; /*小手*/
     13             background: #ffc; /*背景*/
     14         }
     15 
     16     </style>
     17     <script type="text/javascript" src="js/jquery-1.3.2-vsdoc2.js"></script>
     18      <script type="text/javascript">
     19 
     20 
     21         //无参数调用
     22         $(document).ready(function() {
     23             $('#btn1').click(function() {
     24                 $.ajax({
     25                     type: "POST",   //访问WebService使用Post方式请求
     26                     contentType: "application/json", //WebService 会返回Json类型
     27                     url: "Default2.aspx/HelloWorld", //调用WebService的地址和方法名称组合 ---- WsURL/方法名
     28                     data: "{}",         //这里是要传递的参数,格式为 data: "{paraName:paraValue}",下面将会看到      
     29                     dataType: 'json',
     30                     success: function(result) {     //回调函数,result,返回值
     31                         alert(result.d);
     32                     }
     33                 });
     34             });
     35         });
     36 
     37 
     38         //有参数调用
     39         $(document).ready(function() {
     40             $("#btn2").click(function() {
     41                 $.ajax({
     42                     type: "POST",
     43                     contentType: "application/json",
     44                     url: "Default2.aspx/GetWish",
     45                     data: "{value1:'心想事成',value2:'万事如意',value3:'牛牛牛',value4:2009}",
     46                     dataType: 'json',
     47                     success: function(result) {
     48                         alert(result.d);
     49                     }
     50                 });
     51             });
     52         });
     53        
     54        
     55         //返回集合(引用自网络,很说明问题)
     56         $(document).ready(function() {
     57             $("#btn3").click(function() {
     58                 $.ajax({
     59                     type: "POST",
     60                     contentType: "application/json",
     61                     url: "Default2.aspx/GetArray",
     62                     data: "{i:10}",
     63                     dataType: 'json',
     64                     success: function(result) {
     65                         $(result.d).each(function() {
     66                             alert(this);
     67                             $('#dictionary').append(this.toString() + " ");
     68                             //alert(result.d.join(" | "));
     69                         });
     70                     }
     71                 });
     72             });
     73         });
     74 
     75 
     76         //返回复合类型
     77         $(document).ready(function() {
     78             $('#btn4').click(function() {
     79                 $.ajax({
     80                     type: "POST",
     81                     contentType: "application/json",
     82                     url: "Default2.aspx/GetClass",
     83                     data: "{}",
     84                     dataType: 'json',
     85                     success: function(result) {
     86                         $(result.d).each(function() {
     87                             //alert(this);
     88                             $('#dictionary').append(this['ID'] + " " + this['Value']);
     89                             //alert(result.d.join(" | "));
     90                         });
     91 
     92                     }
     93                 });
     94             });
     95         });
     96 
     97         //返回DataSet(XML)
     98         $(document).ready(function() {
     99             $('#btn5').click(function() {
    100                 $.ajax({
    101                     type: "POST",
    102                     url: "Default2.aspx/GetDataSet",
    103                     data: "{}",
    104                     dataType: 'xml', //返回的类型为XML ,和前面的Json,不一样了
    105                     success: function(result) {
    106                     alert(result);
    107                     //演示一下捕获
    108                         try {  
    109                             $(result).find("Table1").each(function() {
    110                                 $('#dictionary').append($(this).find("ID").text() + " " + $(this).find("Value").text());
    111                             });
    112                         }
    113                         catch (e) {
    114                             alert(e);
    115                             return;
    116                         }
    117                     },
    118                     error: function(result, status) { //如果没有上面的捕获出错会执行这里的回调函数
    119                         if (status == 'error') {
    120                             alert(status);
    121                         }
    122                     }
    123                 });
    124             });
    125         });
    126 
    127         //Ajax 为用户提供反馈,利用ajaxStart和ajaxStop 方法,演示ajax跟踪相关事件的回调,他们两个方法可以添加给jQuery对象在Ajax前后回调
    128         //但对与Ajax的监控,本身是全局性的
    129         $(document).ready(function() {
    130             $('#loading').ajaxStart(function() {
    131                 $(this).show();
    132             }).ajaxStop(function() {
    133                 $(this).hide();
    134             });
    135         });
    136 
    137         // 鼠标移入移出效果,多个元素的时候,可以使用“,”隔开
    138         $(document).ready(function() {
    139             $('btn').hover(function() {
    140                 $(this).addClass('hover');
    141             }, function() {
    142                 $(this).removeClass('hover');
    143             });
    144         });
    145     </script>
    146 
    147 </head>
    148 <body>
    149     <form id="form1" runat="server">
    150     <div>
    151     <input type="button" id="btn1" value="HelloWorld"/>
    152     <input type="button" id="btn2" value="传入参数"/>
    153     <input type="button" id="btn3" value="返回集合"/>
    154     <input type="button" id="btn4" value=" 返回复合类型"/>
    155     <input type="button" id="btn5" value="返回DataSet(XML)"/>
    156     </div>
    157     <div id="dictionary">dictionary
    158     </div>
    159     </form>
    160 </body>
    161 </html>
    162 ==================================================================================
    163 
    164 using System;
    165 using System.Collections;
    166 using System.Collections.Generic;
    167 using System.Configuration;
    168 using System.Data;
    169 using System.Linq;
    170 using System.Web;
    171 using System.Web.Security;
    172 using System.Web.UI;
    173 using System.Web.UI.HtmlControls;
    174 using System.Web.UI.WebControls;
    175 using System.Web.UI.WebControls.WebParts;
    176 using System.Web.Services;
    177 
    178 public partial class Default2 : System.Web.UI.Page
    179 {
    180     protected void Page_Load(object sender, EventArgs e)
    181     {
    182 
    183     }
    184     [WebMethod]
    185     public static string HelloWorld()
    186     {
    187         return "123--->456";
    188     }
    189     [WebMethod]
    190     public static string ABC(string ABC)
    191     {
    192         return ABC;
    193     }
    194     [WebMethod]
    195     public static string GetWish(string value1, string value2, string value3, int value4)
    196     {
    197         return string.Format("祝您在{3}年里 {0}、{1}、{2}", value1, value2, value3, value4);
    198     }
    199     /// <summary>
    200     /// 返回集合
    201     /// </summary>
    202     /// <param name="i"></param>
    203     /// <returns></returns>
    204     [WebMethod]
    205     public static List<int> GetArray(int i)
    206     {
    207         List<int> list = new List<int>();
    208 
    209         while (i >= 0)
    210         {
    211             list.Add(i--);
    212         }
    213 
    214         return list;
    215     }
    216 
    217     /// <summary>
    218     /// 返回一个复合类型
    219     /// </summary>
    220     /// <returns></returns>
    221     [WebMethod]
    222     public static Class1 GetClass()
    223     {
    224         return new Class1 { ID = "1", Value = "牛年大吉" };
    225     }
    226 
    227 
    228     /// <summary>
    229     /// 返回XML
    230     /// </summary>
    231     /// <returns></returns>
    232     [WebMethod]
    233     public static DataSet GetDataSet()
    234     {
    235         DataSet ds = new DataSet();
    236         DataTable dt = new DataTable();
    237         dt.Columns.Add("ID", Type.GetType("System.String"));
    238         dt.Columns.Add("Value", Type.GetType("System.String"));
    239         DataRow dr = dt.NewRow();
    240         dr["ID"] = "1";
    241         dr["Value"] = "新年快乐";
    242         dt.Rows.Add(dr);
    243         dr = dt.NewRow();
    244         dr["ID"] = "2";
    245         dr["Value"] = "万事如意";
    246         dt.Rows.Add(dr);
    247         ds.Tables.Add(dt);
    248         return ds;
    249     }
    250     public class Class1
    251     {
    252         public string ID { get; set; }
    253         public string Value { get; set; }
    254     }
    255 
    256 收藏于 2012-03-15
  • 相关阅读:
    基础操作
    需要注意
    简单操作
    git指令-版本回退
    设计模式-代理模式
    在idea下遇到的问题汇总
    maven笔记--持续更新
    poi简介
    Win10添加右键在此处打开命令行
    Ajax&Json案例
  • 原文地址:https://www.cnblogs.com/dqh123/p/9469978.html
Copyright © 2020-2023  润新知