• 用jQuery.ajaxWebService请求WebMethod,Ajax处理实现局部刷新;及Jquery传参数,并跳转页面 用post传过长参数


    首先在aspx.cs文件里建一个公开的静态方法,然后加上WebMethod属性。

    如:

    [WebMethod]
     public static string GetUserName() 
     {
     //......
     }

     

    如果要在这个方法里操作session,那还得将WebMethod的EnableSession 属性设为true 。即:

    [WebMethod(EnableSession = true)]//或[WebMethod(true)]
     public static string GetUserName() 
     {
     //......
     }

      然后我们就写ajax程序来访问这个程序,我们就用jQuery吧。

     $.ajax({
            type: "POST",
            contentType: "application/json",
            url: "WebForm2.aspx/GetUserName",
            data: "{}",
            dataType: "json",
            success: function(){.......}
        });

    参数说明

    type:请求的类型,这里必须用post 。WebMethod方法只接受post类型的请求。
      contentType:发送信息至服务器时内容编码类型。我们这里一定要用application/json 。
      url:请求的服务器端处理程序的路径,格式为"文件名(含后缀)/方法名"
      data:参数列表。注意,这里的参数一定要是json格式的字符串,记住是字符串格式,如:"{aa:11,bb:22,cc:33 , ...}"。如果你写的不是字符串,那jquery会把它实序列化成字符串,那么在服务器端接受到的就不是json格式了,且不能为空,即使没有参数也要写成"{}",如上例。
    很多人不成功,原因就在这里。
      dataType:服务器返回的数据类型。必须是json,其他的都无效。因为webservice 是一json格式返回数据的,其形式为:{"d":"......."}。
      success:请求成功后的回调函数。你可以在这里对返回的数据做任意处理。

     

    可以给jquery做一个扩展,对上面的函数做一下简单的封装:

    建一个脚本文件叫 jquery.extend.js。在里面写一个叫ajaxWebService的方法(因为webmethod其实就是WebService嘛,故此方法对请求*.asmx也是有效的),代码如下:

     

    ///    <summary>
    ///    jQuery原型扩展,重新封装Ajax请求WebServeice
    ///    </summary>
    ///    <param name="url" type="String">
    ///     处理请求的地址
    ///</param>
    ///    <param name="dataMap" type="String">
    ///     参数,json格式的字符串
    ///</param>
    ///    <param name="fnSuccess" type="Function">
    ///     请求成功后的回调函数
    ///</param>
    $.ajaxWebService = function(url, dataMap, fnSuccess) {
        $.ajax({
            type: "POST",
            contentType: "application/json",
            url: url,
            data: dataMap,
            dataType: "json",
            success: fnSuccess
        });
    }

    在WebMethod方法中怎么接收前台传来的Json参数?

     

    比如 后台的方法是:
    public static string getList(int id)

    那前台的传的参数就是: 
    var f = JSON.stringify({ "id": id});
    $.ajax({
    type: "POST",
    url: "/default.aspx/getList",
    contentType: "application/json; charset=utf-8",
    data: f,
    dataType: "json",
    success: function (result) { // 返回值处理},
    error: function (result) { //出错处理}
    });

      

     对于ajax请求datatype为html或text的情况,需要调用JSON.parse或用eval函数;将返回字符串反序列化为JSON对象

    有时Json.parse不能一次成功,可以换个方法,将符串先转json:

    //第一种:eval方式解析

     function strToJson(str){ 

          var json = eval('(' + str + ')'); 

          return json; 

     }

    //第二种:new Function形式

    function strToJson(str){

        var json = (new Function("return " + str))();

        return json;

    }

            public ActionResult GetJSON()

            {

                Person p = new Person();

                p.Id = 1;

                p.Name = "关羽";

                p.Age = 22;

                JavaScriptSerializer jss = new JavaScriptSerializer();

                string JsonStr = jss.Serialize(p);

                return Content(JsonStr);

            }

     

    $(function () {

                $("#btn1").click(function () {

                    $.ajax({

                        url: "/Home/GetJSON",

                        type: "post",

                        dataType: "html",

                        success: function (response) {

                            var obj = JSON.parse(response);

                            $("#Id").text(obj.Id);

                            $("#Name").text(obj.Name);

                            $("#Age").text(obj.Age);

                        }

                    })

                })

            })

     

            public ActionResult GetJson()

            {

                Person p = new Person(1, "关羽", 20);

                string str = ObjToJson2<Person>(p);

                //return Json(p,JsonRequestBehavior.AllowGet);  这种方法也行,而且是.Net提供的,有这个的时候,用这个比较好,没有就自己搞的。

                return Content(str);

            }

     

    $(function () {

                $.ajax({

                    url: "/Home/GetJson",

                    dataType: "text",

                    success: function (response) {

                        alert(response);

                        var obj = strToJson(response);

                        $("#div1").html("姓名:" + obj.Name + "  " + "年龄:" + obj.Age);

                        alert(obj.Name);

                    }

                })

            })

            function strToJson(str) {

                var json = eval('(' + str + ')');

                return json;

            } 

    Jquery传参数,并跳转页面 用post传过长参数
    介绍一下该方法:
    jQuery.post(url, [data], [callback], [type])
    url,[data],[callback],[type]
    url:发送请求地址。
    data:待发送 Key/value 参数。
    callback:发送成功时回调函数。
    type:返回内容格式,xml, html, script, json, text, _default。
    $.post("test.aspx", { name: "John", time: "2pm" }, function() { window.location.href = "test.aspx"; });

  • 相关阅读:
    JS转义 escape()、encodeURI()、encodeURIComponent()区别详解
    PHP解决搜索时在URL地址栏输入中文字符搜索结果出现乱码
    CMSPRESS-PHP无限级分类2
    CMSPRESS-PHP无限级分类
    HTML5-CSS3-JavaScript(3)
    HTML5-CSS3-JavaScript(2)
    HTML5-CSS3-JavaScript(1)
    CSS3-Hover 效果 展示
    JAVA Socket地址绑定
    JAVA Socket无参构造方法的使用
  • 原文地址:https://www.cnblogs.com/shy1766IT/p/3730238.html
Copyright © 2020-2023  润新知