jQuery读取JSON总结

      
分类：
jQuery              2011-02-21 16:01    
5600人阅读    
评论(1)    
收藏    
举报    

jsonjqueryfunctiontreestringemail

1.jQuery 部分

<script src="js/jquery.js" type="text/javascript"></script>

< script type="text/javascript">

    $(document).ready(function() {

        //alert("json");

        var user = { "UserID": 11, "Name": "Truly", "Email": "zhuleipro@hotmail.com" };

        alert(user.UserID);

        alert(user["Name"]);

        //alert(user);

    }); //读取简单对象

    $(document).ready(function() {

        var user = { "UserID": 11, "Name": { "FristName": "Truly", "LastName": "Zhu" }, "Emali": "JerryTienCN@126.vom" };

        alert(user.Name.FristName);

        alert(user["Name"]["FristName"]);

    });

    $(document).ready(function() {

        var userList = [

        { "UserID": 11, "Name": { "FirstName": "Jerry", "LastName": "Tian" }, "Email": "address1" },

        { "UserID": 12, "Name": { "FirstName": "Jerry1", "LastName": "Tian" }, "Email": "address2" },

        { "UserID": 13, "Name": { "FirstName": "Jerry2", "LastName": "Tian" }, "Email": "address3" },

            ];

        alert(userList[0].Name.FirstName);

        alert(userList.length); //读取复杂对象


    });

< /script>

 

2.JSON部分

Json对象从后台传输可以使用WebServie asmx aspx多种方式

Json对象包含在[ ]中

Json数据变量名要用 ""

Json数据需要用{ }分割

前台调用代码如下 ：

  <script type="text/javascript">

        $(document).ready(function() {

            $.ajax({

                url: "NavigateTree.asmx/GetJson",

                type: "POST",

                dataType: "json",

                data: "{}",

                contentType: "application/json; charset=utf-8",

                success: function(json) {

                    alert(json.d);

                    var data = eval('(' + json.d + ')');

                    alert(data);

                    alert(data.length);

                    alert(data[0].showcheck);

                },

                error: function(x, e) {

                    alert(x.responsetText);

                    alert("Error");

                },

                complete: function(x) {

                    //alert(x.responseText);

                }

            });

        });

    </script>

后台代码如下

        [WebMethod]

        public static string GetJson()

        {

            string json = "[";

            List<tbNavigationTree> t = NaviagetTreeDlinqDAL.returnParetnTree();

            foreach (tbNavigationTree model in t)

            {

                if (model != t[t.Count - 1])

                {

                    json += GetJsonByModel(model) + ",";

                }

                else

                {

                    json += GetJsonByModel(model);

                }

            }

            json += "]";

            json=json.Replace("'","/"");

            return json;

        }

        public static string GetJsonByModel(tbNavigationTree t)

        {

            string json = "";

            bool flag = NaviagetTreeDlinqDAL.isHavingChild(t.ID);

            json = "{"

                + "'id':'" + t.ID + "',"

                + "'text':'" + t.ModuleName + "',"

                + "''value':'" + t.ID + "',"

                + "''showcheck':true,"

                + "'checkstate':'0',"

                + "'hasChildren':" + flag.ToString().ToLower() + ","

                + "'isexpand':false,"

                + "'ChildNodes':"; //ChildNodes C一定大写

            if (!flag)

            {

                json += "null,";

                json += "complete'';false}";

            }

            else

            {

                json += "[";

                List<tbNavigationTree> list = NaviagetTreeDlinqDAL.getChild(t.ID);

                foreach(tbNavigationTree tree in list)

                {

                    if (tree != list[list.Count - 1])

                    {

                        json += GetJsonByModel(tree) + ",";

                    }

                    else

                    {

                        json+=GetJsonByModel(tree);

                    }

                }

                json+="],'complete':true}";

            }

            return json;

        }