zoukankan      html  css  js  c++  java
  • Js操作后台返回的json数据

       项目开发工程中经常有类似这样的需求,前台向后台请求一个json数据,后台返回json字符串提供前台,js获取之后对前端进行对应的操作。

       这里需要主要的是在前台获取到json字符串后需要转换成json对象:

    //JSON字符串:
       
    var str1 = '{ "name": "cxh", "sex": "man" }';
       
    //JSON对象:
       
    var str2 = { "name": "cxh", "sex": "man" };
       
    //一、JSON字符串转换为JSON对象
       
    //要运用上面的str1,必须运用下面的要领先转化为JSON对象:
       
    //由JSON字符串转换为JSON对象
       
    var obj = eval('(' + str + ')');
       
    //或者
       
    var obj = str.parseJSON(); //由JSON字符串转换为JSON对象
       
    //或者
       
    var obj = JSON.parse(str); //由JSON字符串转换为JSON对象
       
    //然后,就可以这样读取:
       
    Alert(obj.name);
       
    Alert(obj.sex);

       为了描述此功能,小猪

       模拟后台数据:

       使用的是ASP.NET MVC

    [HttpPost]
    public JsonResult Books()
    {
        Entity.Books result = new Books(){
                Title="标题标题",
                Brief="简介简介",
                Auther="作者作者"'
                Price="价格价格",
                Tag="标签标签"
            };
        return Json(result);
    }

       后台返回给前台之后前台需要相应的操作:

    function loadBooksInformation(par) {
        var book = JSON.parse(par);//转换成json对象
       
        var bookTitle = $("#bookTitle");
        var bookSummary = $("#bookSummary");
        var bookAuther = $("#bookAuther");
        var bookPrice = $("#bookPrice");
        var bookTag = $("#bookTag");
       
       
        bookTitle.val(book.Title);
        bookSummary.val(book.Brief);
        bookAuther.val(book.Auther);
        bookPrice.val(book.Price);
        bookTag.val(book.Tag);
    }

       这样,一个传输过程就完成了。当然,小猪省略了使用js向后台请求数据的过程。

       

       特别留心:

       如果obj本来就是一个JSON对象,那么运用 eval()函数转换后(哪怕是多次转换)还是JSON对象,但是运用 parseJSON()函数处理后会有疑问(抛出语法异常)。

       

       PS:如果我需要将json字符串转换成C#对象呢?具体请您参照:http://www.smallerpig.com/archives/292

       

       

       

  • 相关阅读:
    sfs2x 连接 mongodb
    java websocket
    webstorm 4.0 注册码
    解决 sfs2 admin tool 找不到扩展
    window 注册表五大类
    opengl 学习第二日
    java google Protobuf
    扩展 java sencha touch PhonegapPlugin
    sencha touch2 kryonet socket phonegap 通信 作者:围城
    sencha touch2 layout 笔记
  • 原文地址:https://www.cnblogs.com/smallerpig/p/3646138.html
Copyright © 2011-2022 走看看