• 取得页面上存储的json格式数据


        <div class="ch">
            <input type="text" class="in" value="{"a":"1,2,3"}">
            <input type="text" class="in" value="{"b":"2,3,4"}">
            <input type="button" class="btn" value="转换">
        </div>

    现在想把input框内的对象数据取出来,怎么办呢?

    我们可以先取出来字符串,再通过JSON.parse方法来处理:

    $('.btn').on('click', function(){
            var args = {};
            $('.ch').find('.in').each(function(index, ele){
                var _args = $(ele).val()
                _args = JSON.parse(_args)
                for(var key in _args){
                    var value = args[key] ? args[key] + ',' : ''
                    args[key] = value + _args[key]
                }
            });
            console.log(args)
        })

    我们可以得到想要的结果:

    {a: "1,2,3", b: "2,3,4"}

     那么如果input框内不是标准的json格式呢?比如这样:

        <div class="ch">
            <input type="text" class="in" value="{'a':'1,2,3'}">
            <input type="text" class="in" value="{'b':'2,3,4'}">
            <input type="button" class="btn" value="转换">
        </div>

    再使用JSON的parse是会报错的。

    VM729:1 Uncaught SyntaxError: Unexpected token ' in JSON at position 1
    at JSON.parse (<anonymous>)
    at HTMLInputElement.<anonymous> (foreach.html:40)
    at Function.each (jquery-1.11.0.js:384)
    at jQuery.fn.init.each (jquery-1.11.0.js:137)
    at HTMLInputElement.<anonymous> (foreach.html:37)
    at HTMLInputElement.dispatch (jquery-1.11.0.js:4624)
    at HTMLInputElement.elemData.handle (jquery-1.11.0.js:4292)

     怎么办呢?

    $('.btn').on('click', function(){
            var args = {};
            $('.ch').find('.in').each(function(index, ele){
                var _args = new Function('return ' + $(this).val())()
    
                for(var key in _args){
                    var value = args[key] ? args[key] + ',' : ''
                    args[key] = value + _args[key]
                }
            });
            console.log(args)
        })

    结果同上面是一样的。

  • 相关阅读:
    UIView的常见属性
    Object-C-Foundation-反射
    Object-C-自定义类型归档
    Java集合:HashMap源码剖析
    spring-boot-2.0.3之quartz集成,数据源问题,源码探究
    杂谈篇之我是怎么读源码的,授之以渔
    ElasticSearch 从零到入门
    java实现图片上传功能,并返回图片保存路径
    quartz定时任务及时间设置
    笛子初学者吹什么曲子
  • 原文地址:https://www.cnblogs.com/mantishell/p/12098331.html
Copyright © 2020-2023  润新知