取得页面上存储的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)
    })

结果同上面是一样的。