利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法。

[WebMethod]   命名空间

1、无参数的方法调用, 注意：1.方法一定要静态方法，而且要有[WebMethod]的声明

后台<C#>:

1
2
3
4
5
6
7
using System.Web.Script.Services;  
 
[WebMethod]  
public static string SayHello()  
{  
     return "Hello Ajax!";  
}

前台<JQuery>:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
$(function() {  
    $("#btnOK").click(function() {  
        $.ajax({  
            //要用post方式  
            type: "Post",  
            //方法所在页面和方法名  
            url: "data.aspx/SayHello",  
            contentType: "application/json; charset=utf-8",  
            dataType: "json",  
            success: function(data) {  
                //返回的数据用data.d获取内容  
                alert(data.d);  
            },  
            error: function(err) {  
                alert(err);  
            }  
        });  
 
        //禁用按钮的提交  
        return false;  
    });  
});

2、带参数的方法调用

后台<C#>:

1
2
3
4
5
6
7
using System.Web.Script.Services;
 
[WebMethod]
public static string GetStr(string str, string str2)
{
    return str + str2;
}

前台<JQuery>:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
$(function() {  
    $("#btnOK").click(function() {  
        $.ajax({  
            type: "Post",  
            url: "data.aspx/GetStr",  
            //方法传参的写法一定要对，str为形参的名字,str2为第二个形参的名字  
            data: "{'str':'我是','str2':'XXX'}",  
            contentType: "application/json; charset=utf-8",  
            dataType: "json",  
            success: function(data) {  
                //返回的数据用data.d获取内容  
                  alert(data.d);  
            },  
            error: function(err) {  
                alert(err);  
            }  
        });  
 
        //禁用按钮的提交  
        return false;  
    });  
});

3、返回数组方法的调用

后台<C#>:

1
2
3
4
5
6
7
8
9
10
11
12
using System.Web.Script.Services;
 
[WebMethod]
public static List<string> GetArray()
{
    List<string> li = new List<string>();
 
    for (int i = 0; i < 10; i++)
        li.Add(i + "");
 
    return li;
}

前台<JQuery>:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
$(function() {  
    $("#btnOK").click(function() {  
        $.ajax({  
            type: "Post",  
            url: "data.aspx/GetArray",  
            contentType: "application/json; charset=utf-8",  
            dataType: "json",  
            success: function(data) {  
                //插入前先清空ul  
                $("#list").html("");  
 
                //递归获取数据  
                $(data.d).each(function() {  
                    //插入结果到li里面  
                    $("#list").append("<li>" + this + "</li>");  
                });  
 
                alert(data.d);  
            },  
            error: function(err) {  
                alert(err);  
            }  
        });  
 
        //禁用按钮的提交  
        return false;  
    });  
});
/// <reference path="jquery-1.4.2-vsdoc.js"/>
$(function() {
    $("#btnOK").click(function() {
        $.ajax({
            type: "Post",
            url: "data.aspx/GetArray",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(data) {
                //插入前先清空ul
                $("#list").html("");
 
                //递归获取数据
                $(data.d).each(function() {
                    //插入结果到li里面
                    $("#list").append("<li>" + this + "</li>");
                });
 
                alert(data.d);
            },
            error: function(err) {
                alert(err);
            }
        });
 
        //禁用按钮的提交
        return false;
    });
});

4、返回Hashtable方法的调用

后台<C#>:

1
2
3
4
5
6
7
8
9
10
11
12
13
using System.Web.Script.Services;
using System.Collections;
 
[WebMethod]
public static Hashtable GetHash(string key,string value)
{
    Hashtable hs = new Hashtable();
 
    hs.Add("www", "yahooooooo");
    hs.Add(key, value);
     
    return hs;
}

前台<JQuery>:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
$(function() {  
    $("#btnOK").click(function() {  
        $.ajax({  
            type: "Post",  
            url: "data.aspx/GetHash",  
            //记得加双引号 T_T  
            data: "{ 'key': 'haha', 'value': '哈哈！' }",  
            contentType: "application/json; charset=utf-8",  
            dataType: "json",  
            success: function(data) {  
                alert("key: haha ==> "+data.d["haha"]+"\n key: www ==> "+data.d["www"]);  
            },  
            error: function(err) {  
                alert(err + "err");  
            }  
        });  
 
        //禁用按钮的提交  
        return false;  
    });  
});

5、操作xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
XMLtest.xml:
 
view plaincopy to clipboardprint?
<?xml version="1.0" encoding="utf-8" ?>
<data>
<item>
    <id>1</id>
    <name>qwe</name>
</item>
<item>
    <id>2</id>
    <name>asd</name>
</item>
</data>
<?xml version="1.0" encoding="utf-8" ?>
<data>
<item>
    <id>1</id>
    <name>qwe</name>
</item>
<item>
    <id>2</id>
    <name>asd</name>
</item>
</data>

前台<JQuery>:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
$(function() {  
    $("#btnOK").click(function() {  
        $.ajax({  
            url: "XMLtest.xml",  
            dataType: 'xml', //返回的类型为XML ，和前面的Json，不一样了  
            success: function(xml) {  
                //清空list  
                $("#list").html("");  
                //查找xml元素
                $(xml).find("data>item").each(function() {  
                    $("#list").append("<li>id:" + $(this).find("id").text() +"</li>");  
                    $("#list").append("<li>Name:"+ $(this).find("name").text() + "</li>");  
                })  
            },  
            error: function(result, status) { //如果没有上面的捕获出错会执行这里的回调函数  
                alert(status);  
            }  
        });  
 
        //禁用按钮的提交  
        return false;  
    });  
});

类型：Jquery；问题：jquery调用后台带参数方法；结果：利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法。的更多相关文章

  1. 利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法

    利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法. 先来个简单的实例热热身吧. 1.无参数的方法调用 asp.net code: view plaincopy to clip ...

  2. C# 调用Mysql 带参数存储过程

    使用C#调用Mysql 带参数的存储过程: 1.创建带参数的存储过程:USP_Temp_Test 2.两个参数:IN 参数为 P_XML , OUT 参数为 P_ErrorOut 3.C#代码调用该存 ...

  3. c#调用Mysql带参数的存储过程

    1.首先创建一个带参数的存储过程 ①存储过程名称=proc_bookinfo  ②存储过程2个参数 一个in 一个out in参数名称=ispay out参数名称=unPaycount ③ 这个存储过 ...

  4. 25．按要求编写一个Java应用程序： （1）编写一个矩形类Rect，包含： 两个属性：矩形的宽width；矩形的高height。 两个构造方法： 1．一个带有两个参数的构造方法，用于将width和height属性初化； 2．一个不带参数的构造方法，将矩形初始化为宽和高都为10。 两个方法： 求矩形面积的方法area() 求矩形周长的方法perimeter() （2）通过继承Rect类编写一个具有

    package zhongqiuzuoye; //自己写的方法 public class Rect { public double width; public double height; Rect( ...

  5. jQuery获取URL中所带参数的办法

    可以使用正则表达式进行结果的拆分: http://www.cnblogs.com/babycool/p/3169058.html 可以直接进行所需内容的split: http://blog.scien ...

  6. Lua调用C++带参数的方法

    C++代码: // LuaAndC.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <iostream> #i ...

  7. 按要求编写一个Java应用程序： （1）编写一个矩形类Rect，包含： 两个属性：矩形的宽width；矩形的高height。 两个构造方法： 1．一个带有两个参数的构造方法，用于将width和height属性初化； 2．一个不带参数的构造方法，将矩形初始化为宽和高都为10。 两个方法： 求矩形面积的方法area() 求矩形周长的方法perimeter() （2）通过继承Rect类编写一个具有确定位

    package com.hanqi.test; public class Rect { ; ; public double getWidth() { return width; } public vo ...

  8. 利用JQuery直接调用asp.net后台方法

    利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法. [WebMethod]   命名空间 1.无参数的方法调用, 注意:1.方法一定要静态方法,而且要有[WebMethod] ...

  9. 利用JQuery直接调用asp.net后台的简单方法

    利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法. [WebMethod]   命名空间 1.无参数的方法调用, 注意:1.方法一定要静态方法,而且要有[WebMethod] ...

随机推荐

  1. 在Windows下使用adb logcat grep

    在Windows下使用adb logcat  grep 会提示 因为grep 为Linux命令,所以不能使用.怎么办呢? 这时候可以用到babun 下载地址:http://babun.github.i ...

  2. Linux 软链接操作项目

    项目添加软链 ln -s 源文件 目标文件 指令 ln -s /home/wwwroot/default/nikon/panda/pc ./pc ln -s /home/wwwroot/default ...

  3. R语言常用语法总结

    ## 1. 数据输入 ##a$b # 数据框中的变量a = 15 # 赋值a <- 15 # 赋值a = c(1,2,3,4,5) # 数组(向量)b = a[1] # 数组下标,从1开始b = ...

  4. css3表格样式

    <caption>  关于表格存储内容的描述或总结. 1.border-spacing:0;border-spacing 属性设置相邻单元格的边框间的距离(仅用于“边框分离”模式). 2. ...

  5. thinkphp中composer方式安装的插件如何使用

    thinkphp中composer方式安装的插件如何使用 一.总结 一句话总结:任何东西都是可以百度或者google搜到的,要自己先想怎么解决,解决不出来迅速百度,不要自己臆断 1.在tp5框架的什么 ...

  6. python中的list和array的不同之处 2

    版权声明:本文为博主非原创文章,未经博主允许可以转载.     Python中的list和array的不同之处 python中的list是python的内置数据类型,list中的数据类不必相同的,而a ...

  7. django实现日期分类效果

    日期分类效果图 实现功能:能够按照月份进行分类,统计每个月份的文章数量,没有文章的月份不显示.点击每栏可以链接的当月的文章列表. 每月文章列表可以使用django的通用视图MonthArticleVi ...

  8. DataSet.WriteXml()

    枚举通常是作为 DataSet.WriteXml() 方法的第二个参数使用.它决定使用哪种格式保存XML: IgnoreSchema --默认值.只写数据集的数据,不带有任何架构信息.如果数据集内无数 ...

  9. 测试通过！为何线上还有很多BUG？

    质量控制 大多数测试人员认为测试工作是发现bug,虽然这是测试的主要任务,但其实测试最重要的任务是质量控制,而发现bug和验证bug只是质量控制的一个重要环节而已. 我想很多测试人员都经历过这样的场景 ...

  10. 解决: PyInstaller打包后exe文件打开时出现failed to execute script

    def resource_path(self, relative): if hasattr(sys, "_MEIPASS"): return os.path.join(sys._M ...