zoukankan      html  css  js  c++  java
  • So easy,JQuery调用WebServices

    距离上一篇博客文章已经是好长时间了,一来才疏学浅,二来没有时间,哈哈,废话不多说,入题先问
    你是不是经常作这种开发,前端用JS写逻辑,后端用aspx或者ashx作服务?
    你是不是经常在请求aspx的时候在查询字符串中拼接诸如a.aspx?method=getDepartmetn&param1=1&param2=2的字符串?
    你甚至为每个ajax请求添加一个后端页面!
    你是不是甚至在想,尼玛,要是能够直接调用C#类文件中的方法就爽了?!(这里FishLi做了一个框架,有兴趣可以去看看)
    可是,你大概忘记了,我们是程序员,我们是懒惰的,我们要让电脑给我们干更多的事情!(这里装装13),但其实,微软和JQuery大牛们早帮我们解决了这个小问题。
    大致的调用分为以下几种:
    1 无参数 有返回值的调用
    前端JS

    复制代码
    $("#btn1").click(function() {
                    $.ajax({
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: "CalledByJquery.asmx/HelloWorld",
                        data: "{}",
                        dataType: "json",
                        success: function(json) { alert(json.d); },
                        error: function(error) {
                            alert("调用出错" + error.responseText);
                        }
                    });
                });
    复制代码


    后端WebMethod

    [WebMethod]
    public string HelloWorld()
    {
          return "Hello World";
    }

     用谷歌调试的结果:


    2 简单参数 简单返回值的调用
    前端JS

    复制代码
     $("#btn2").click(function() {
                    $.ajax({
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: "CalledByJquery.asmx/SimpleReturns",
                        data: "{name:'张三'}",
                        dataType: "json",
                        success: function(json) { alert(json.d); },
                        error: function(error) {
                            alert("调用出错" + error.responseText);
                        }
                    });
                });
    复制代码


    后端WebMethod

    [WebMethod]
            public string SimpleReturns(string name)
            {
                return String.Format("您的姓名是{0}", name);
            }

     用谷歌调试的结果:


    3 复杂参数 复杂返回值的调用
    前端JS

    复制代码
    $("#btn3").click(function() {
                    $.ajax({
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: "CalledByJquery.asmx/GetStudentList",
                        data: "{stu:{ID:'6',Name:'ff'}}",
                        dataType: "json",
                        success: function(json) { alert(json.d); },
                        error: function(error) {
                            alert("调用出错" + error.responseText);
                        }
                    });
                });
    复制代码


    后端WebMethod

    复制代码
    [WebMethod]
            public List<Student> GetStudentList(Student stu)
            {
                List<Student> studentList = new List<Student> 
                {
                    new Student{ID=1,Name="张三"},
                    new Student{ID=2,Name="李四"}
                };
                //把从客户端传来的实体放回到返回值中
                studentList.Add(stu);
                return studentList;
            }
    复制代码

     用谷歌调试的结果:


    4 返回匿名对象的WebMethod的调用
    前端JS

    复制代码
                $("#btn4").click(function() {
                    $.ajax({
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: "CalledByJquery.asmx/ReturnNoNameClass",
                        data: "{}",
                        dataType: "json",
                        success: function(json) { alert(json.d); },
                        error: function(error) {
                            alert("调用出错" + error.responseText);
                        }
                    });
                });
    复制代码


    后端WebMethod

     [WebMethod]
            public object ReturnNoNameClass()
            {
                return new { ID = 1, Name = "张三" };
            }

     用谷歌调试的结果:

    哈哈,到这里,你是不是也觉得so easy,妈妈再也不用担心我的学习了,其实很多东西都很简单,但没人告诉我们,而我们自己在实际开发中又没有这种需求,所以给我们的开发造成了一定的障碍,

  • 相关阅读:
    Leetcode Reverse Words in a String
    topcoder SRM 619 DIV2 GoodCompanyDivTwo
    topcoder SRM 618 DIV2 MovingRooksDiv2
    topcoder SRM 618 DIV2 WritingWords
    topcoder SRM 618 DIV2 LongWordsDiv2
    Zepto Code Rush 2014 A. Feed with Candy
    Zepto Code Rush 2014 B
    Codeforces Round #245 (Div. 2) B
    Codeforces Round #245 (Div. 2) A
    Codeforces Round #247 (Div. 2) B
  • 原文地址:https://www.cnblogs.com/newsouls/p/2683677.html
Copyright © 2011-2022 走看看