jsp 实现生成json串的需求

json有java的实现包，直接引用就好了。

最主要的还是jsp里 js的代码因为层数的不确定性造成不知道该去对应的key和value值。

json有java的实现包本来就是无限层的。

具体不记得了但是按照lz的说法，在js中判undefined可以呢？既然在json中没有不封装，js中值也就是undefined的吧，很久不玩前端咯

json字符串转js对象可以直接用eval 虽然不怎么推荐
js对象转json字符串可以递归遍历这个对象自己拼接字符串试试不是很明白你的意思

jsp 实现生成json串？
没理解具体什么意思，是否是前台维护类似于树状结构，然后将js对象转为json？
如果只是js对象转json的话可以使用jquery。
如果是维护树状结构js有问题的话说明具体问题

就是我前台jsp要实现用户输入参数值和参数名称，通过遍历用户输入的，然后生辰json串。
jsp类似：

就是我前台jsp要实现用户输入参数值和参数名称，通过遍历用户输入的，然后生辰json串。
jsp类似：
不急的话晚上回家给你做个例子，看看是不是你要的

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>JSON生成</title>
</head>
<body>
    <div>UserId:<input type="text" id="UserId" /></div>
    <div>Password:<input type="password" id="Password" /></div>
    <div>trade:<input type="text" id="trade" /></div>
    <div>OfferInfoList:
        Id:<input type="text" id="Id" />
        Name:<input type="text" id="Name" />
        region:<input type="text" id="region" />
        <input type="button" id="addOfferInfoList" value="添加OfferInfo">
        <div id="offerInfoTip"></div>
    </div>
    <input value="显示JSON" type="button" id="show" />
    <div id="result"></div>
    <script type="text/javascript">
        function $(id){
            return document.getElementById(id);
        }
        var obj = {UserId:'',Password:'',trade:'',OfferInfoList:[]};
        window.onload = function(){
            $('show').onclick = function(){
                var UserId = $('UserId').value;
                var Password = $('Password').value;
                var trade = $('trade').value;
                obj.UserId = UserId;
                obj.Password = Password;
                obj.trade = trade;
                $('result').innerHTML = JSON.stringify(obj);
            }
            $('addOfferInfoList').onclick = function(){
                var Id = $('Id').value;
                var Name = $('Name').value;
                var region = $('region').value;
                var offerInfo = {
                    Id:Id,
                    Name:Name,
                    region:region
                }
                obj.OfferInfoList.push(offerInfo);
                $('Id').value = '';
                $('Name').value = '';
                $('region').value = '';
                $('offerInfoTip').innerHTML = '已添加'+obj.OfferInfoList.length+'条offerinfo';
            }
        }
    </script>
</body>
</html>这样？

就是我前台jsp要实现用户输入参数值和参数名称，通过遍历用户输入的，然后生辰json串。
jsp类似：
不急的话晚上回家给你做个例子，看看是不是你要的好谢谢你！麻烦了弄了两天了还是没有头绪。

自己写的，可以看看
http://suleil1.blog.163.com/blog/static/4501288220121094316138/

window.onload 为啥不用jquery ready.你还是列要实现的功能吧，帮你转变一下思路，说不定会好些。

要实现的功能就是用户输出参数名称和参数值形成一个树状的结构然后根据这个树状的结构生成一个json串

我的意思就是形如这种图片，就是用户输出参数名称和参数值形成一个树状的结构然后根据这个树状的结构生成一个json串

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>JSON生成</title>
    <style>
        .sub{
            margin-left:5px;
        }
        div{position:relative;}
        .sub_child{
            margin-left:20px;
        }
    </style>
</head>
<body>
    <div id="container">
        <div>
            <a href="javascript:void(0)" class="other" self="first_other" id="first_other" level="1">同</a><a self="first_sub" level="1" href="javascript:void(0)" id="first_sub" class="sub">子</a><input self="first_other" type="text" name="pname" level="1" id="first_pname">:<input self="first_sub" level="1" type="text" name="pvalue" id="first_pvalue"/>
            <div class="sub_child"></div>
        </div>
    </div>
    <input value="显示JSON" type="button" id="show" />
    <div id="result"></div>
    <script type="text/javascript">
        function $(id){
            return document.getElementById(id);
        }
        var obj = {},sour = {};
        window.onload = function(){
            var d = document,container = $('container');
            function createAttr(level,who,sub){
                var now = (new Date()).getTime();
                var self = 'name'+now;
                var _parent = level==1 ? container : (!sub ? who.parentNode.parentNode : who.parentNode.getElementsByClassName('sub_child')[0]);
                var frag = d.createDocumentFragment();
                var con = d.createElement('div');
                var othera = d.createElement('a');
                othera.href="javascript:void(0)";
                othera.setAttribute('level',level);
                othera.innerHTML = '同'
                othera.setAttribute('self',self);
                var suba = othera.cloneNode();
                suba.innerHTML = '子';
                suba.className = 'sub';
                var attrName = d.createElement('input');
                attrName.name = 'pname';
                attrName.type = 'text';
                attrName.setAttribute('self',self)
                var attrValue = attrName.cloneNode();
                attrValue.name = 'pvalue';
                attrValue.type = 'text';
                attrName.setAttribute('self','name'+now);
                attrValue.setAttribute('self','name'+now);
                attrName.setAttribute('level',level);
                attrValue.setAttribute('level',level);
                con.appendChild(othera);
                con.appendChild(suba);
                con.appendChild(attrName);
                var split = d.createTextNode(':');
                var subcon = d.createElement('div')
                subcon.className= 'sub_child'
                con.appendChild(split);
                con.appendChild(attrValue);
                var del = othera.cloneNode();
                del.innerHTML = '删';
                con.appendChild(del);
                con.appendChild(subcon);
                frag.appendChild(con);
                if(who){
                    var parentName = sub ? who.getAttribute('self') : who.getAttribute('parent');
                    attrName.setAttribute('parent',parentName);
                    attrValue.setAttribute('parent',parentName);
                    othera.setAttribute('parent',parentName);
                    suba.setAttribute('parent',parentName);
                }
                del.onclick = function(){
                    var parent = this.parentNode;
                    parent.parentNode.removeChild(parent)
                }
                _parent.appendChild(frag);
                othera.onclick = function(){
                    var level = this.getAttribute('level');
                    createAttr(level,this);
                };
                suba.onclick = function(){
                    var level = parseInt(this.getAttribute('level'));
                    var parent = this.parentNode;
                    var valueinput = parent.getElementsByTagName('input')[1];
                    if(valueinput.type!='checkbox'){
                        var tip = d.createTextNode('数组');
                        parent.insertBefore(tip,valueinput);
                        var checkbox = valueinput.cloneNode();
                        checkbox.type = 'checkbox';
                        parent.insertBefore(checkbox,tip);
                        parent.removeChild(valueinput);
                    }
                    createAttr(level + 1,this,true);
                }
            }
            function init(){
                var key1 = $('first_other').getAttribute('self');
                $('first_other').onclick = function(){
                    var level = this.getAttribute('level');
                    createAttr(level,this);
                }
                var now = (new Date()).getTime()
                $('first_other').setAttribute('self','name'+now);
                $('first_sub').setAttribute('self','name'+now);
                $('first_pname').setAttribute('self','name'+now);
                $('first_pvalue').setAttribute('self','name'+now);
                $('first_sub').onclick = function(){
                    var level = parseInt(this.getAttribute('level'));
                    var parent = this.parentNode;
                    var valueinput = parent.getElementsByTagName('input')[1];
                    if(valueinput.type!='checkbox'){
                        var tip = d.createTextNode('数组');
                        parent.insertBefore(tip,valueinput);
                        var checkbox = valueinput.cloneNode();
                        checkbox.type = 'checkbox';
                        parent.insertBefore(checkbox,tip);
                        parent.removeChild(valueinput);
                    }
                    createAttr(level + 1,this,true);
                    var self = this.getAttribute('self');
                    sour[self] = {};
                }
            }
            init();
            function gettype(obj){
                return Object.prototype.toString.call(obj);
            }
            $('show').onclick = function(){
                console.log(sour)
                var nameinputs = document.getElementsByName('pname');
                var valueinputs = document.getElementsByName('pvalue');
                var len = nameinputs.length;
                var ip,vip;
                var arr = [],objarr = {};
                for(var i=0;i<len;i++){
                    ip = nameinputs[i],vip = valueinputs[i];
                    var parent = ip.getAttribute('parent');
                    var _k = ip.value,_v = vip.type=='checkbox' ? (vip.checked ? [] : {}) :vip.value,_id = ip.getAttribute('self');
                    var level = parseInt(ip.getAttribute('level'))
                    objarr[_id] = {
                        id:_id,
                        key:_k,
                        value : _v,
                        p : parent,
                        level : level
                    }
                }
                for(var p in objarr){
                    if(objarr[p].p){
                        var pid = objarr[p].p;
                        var selfid = objarr[p].id;
                        if(gettype(objarr[pid].value)=='[object Object]'){
                            objarr[pid].value[selfid] = objarr[p];
                        }else if(gettype(objarr[pid].value)=='[object Array]'){
                            objarr[pid].value.push(objarr[p]);
                        }else{

                        }
                    }
                }
                var _final = {};
                for(var p in objarr){
                    if(objarr[p].level == 1){
                        createObj(objarr[p],_final);
                    }
                }
                function createObj(obj,who){
                    var _type = gettype(obj.value);
                    if(_type=='[object Object]'){
                        !who[obj.key] && (who[obj.key] = {});
                        for(var p in obj.value){
                            createObj(obj.value[p],who[obj.key]);
                        }
                    }else if(_type=='[object Array]'){
                        !who[obj.key] && (who[obj.key] = []);
                        for(var i=0,len=obj.value.length;i<len;i++){
                            var thisobj = {};
                            who[obj.key].push(thisobj);

                            createObj(obj.value[i],thisobj);
                        }
                    }else{
                        who[obj.key] = obj.value;
                    }
                }
                $('result').innerHTML = JSON.stringify(_final)
                console.log(_final)
                _final = {}
            }
        }
    </script>
</body>
</html>
凑合用吧。。最后拼JSON，拼的累死我了。

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>JSON生成</title>
    <style>
        .sub{
            margin-left:5px;
        }
        div{position:relative;}
        .sub_child{
            margin-left:20px;
        }
    </style>
</head>
<body>
    <div id="container">
        <div>
            <a href="javascript:void(0)" class="other" self="first_other" id="first_other" level="1">同</a><a self="first_sub" level="1" href="javascript:void(0)" id="first_sub" class="sub">子</a><input self="first_other" type="text" name="pname" level="1" id="first_pname">:<input self="first_sub" level="1" type="text" name="pvalue" id="first_pvalue"/>
            <div class="sub_child"></div>
        </div>
    </div>
    <input value="显示JSON" type="button" id="show" />
    <div id="result"></div>
    <script type="text/javascript">
        function $(id){
            return document.getElementById(id);
        }
        var obj = {},sour = {};
        window.onload = function(){
            var d = document,container = $('container');
            function createAttr(level,who,sub){
                var now = (new Date()).getTime();
                var self = 'name'+now;
                var _parent = level==1 ? container : (!sub ? who.parentNode.parentNode : who.parentNode.getElementsByClassName('sub_child')[0]);
                var frag = d.createDocumentFragment();
                var con = d.createElement('div');
                var othera = d.createElement('a');
                othera.href="javascript:void(0)";
                othera.setAttribute('level',level);
                othera.innerHTML = '同'
                othera.setAttribute('self',self);
                var suba = othera.cloneNode();
                suba.innerHTML = '子';
                suba.className = 'sub';
                var attrName = d.createElement('input');
                attrName.name = 'pname';
                attrName.type = 'text';
                attrName.setAttribute('self',self)
                var attrValue = attrName.cloneNode();
                attrValue.name = 'pvalue';
                attrValue.type = 'text';
                attrName.setAttribute('self','name'+now);
                attrValue.setAttribute('self','name'+now);
                attrName.setAttribute('level',level);
                attrValue.setAttribute('level',level);
                con.appendChild(othera);
                con.appendChild(suba);
                con.appendChild(attrName);
                var split = d.createTextNode(':');
                var subcon = d.createElement('div')
                subcon.className= 'sub_child'
                con.appendChild(split);
                con.appendChild(attrValue);
                var del = othera.cloneNode();
                del.innerHTML = '删';
                con.appendChild(del);
                con.appendChild(subcon);
                frag.appendChild(con);
                if(who){
                    var parentName = sub ? who.getAttribute('self') : who.getAttribute('parent');
                    attrName.setAttribute('parent',parentName);
                    attrValue.setAttribute('parent',parentName);
                    othera.setAttribute('parent',parentName);
                    suba.setAttribute('parent',parentName);
                }
                del.onclick = function(){
                    var parent = this.parentNode;
                    parent.parentNode.removeChild(parent)
                }
                _parent.appendChild(frag);
                othera.onclick = function(){
                    var level = this.getAttribute('level');
                    createAttr(level,this);
                };
                suba.onclick = function(){
                    var level = parseInt(this.getAttribute('level'));
                    var parent = this.parentNode;
                    var valueinput = parent.getElementsByTagName('input')[1];
                    if(valueinput.type!='checkbox'){
                        var tip = d.createTextNode('数组');
                        parent.insertBefore(tip,valueinput);
                        var checkbox = valueinput.cloneNode();
                        checkbox.type = 'checkbox';
                        parent.insertBefore(checkbox,tip);
                        parent.removeChild(valueinput);
                    }
                    createAttr(level + 1,this,true);
                }
            }
            function init(){
                var key1 = $('first_other').getAttribute('self');
                $('first_other').onclick = function(){
                    var level = this.getAttribute('level');
                    createAttr(level,this);
                }
                var now = (new Date()).getTime()
                $('first_other').setAttribute('self','name'+now);
                $('first_sub').setAttribute('self','name'+now);
                $('first_pname').setAttribute('self','name'+now);
                $('first_pvalue').setAttribute('self','name'+now);
                $('first_sub').onclick = function(){
                    var level = parseInt(this.getAttribute('level'));
                    var parent = this.parentNode;
                    var valueinput = parent.getElementsByTagName('input')[1];
                    if(valueinput.type!='checkbox'){
                        var tip = d.createTextNode('数组');
                        parent.insertBefore(tip,valueinput);
                        var checkbox = valueinput.cloneNode();
                        checkbox.type = 'checkbox';
                        parent.insertBefore(checkbox,tip);
                        parent.removeChild(valueinput);
                    }
                    createAttr(level + 1,this,true);
                    var self = this.getAttribute('self');
                    sour[self] = {};
                }
            }
            init();
            function gettype(obj){
                return Object.prototype.toString.call(obj);
            }
            $('show').onclick = function(){
                console.log(sour)
                var nameinputs = document.getElementsByName('pname');
                var valueinputs = document.getElementsByName('pvalue');
                var len = nameinputs.length;
                var ip,vip;
                var arr = [],objarr = {};
                for(var i=0;i<len;i++){
                    ip = nameinputs[i],vip = valueinputs[i];
                    var parent = ip.getAttribute('parent');
                    var _k = ip.value,_v = vip.type=='checkbox' ? (vip.checked ? [] : {}) :vip.value,_id = ip.getAttribute('self');
                    var level = parseInt(ip.getAttribute('level'))
                    objarr[_id] = {
                        id:_id,
                        key:_k,
                        value : _v,
                        p : parent,
                        level : level
                    }
                }
                for(var p in objarr){
                    if(objarr[p].p){
                        var pid = objarr[p].p;
                        var selfid = objarr[p].id;
                        if(gettype(objarr[pid].value)=='[object Object]'){
                            objarr[pid].value[selfid] = objarr[p];
                        }else if(gettype(objarr[pid].value)=='[object Array]'){
                            objarr[pid].value.push(objarr[p]);
                        }else{

                        }
                    }
                }
                console.log(objarr)
                var _final = {};
                for(var p in objarr){
                    if(objarr[p].level == 1){
                        createObj(objarr[p],_final);
                    }
                }
                function createObj(obj,who){
                    var _type = gettype(obj.value);
                    if(_type=='[object Object]'){
                        !who[obj.key] && (who[obj.key] = {});
                        for(var p in obj.value){
                            createObj(obj.value[p],who[obj.key]);
                        }
                    }else if(_type=='[object Array]'){
                        !who[obj.key] && (who[obj.key] = []);
                        for(var i=0,len=obj.value.length;i<len;i++){
                            if(obj.value[i].key!=''){
                                var thisobj = {};
                                who[obj.key].push(thisobj);
                                createObj(obj.value[i],thisobj);
                            }else{
                                createObj(obj.value[i],who[obj.key]);
                            }
                        }
                    }else{
                        if(obj.key!=''){
                            who[obj.key] = obj.value;
                        }else{
                            who.push(obj.value);
                        }
                    }
                }
                $('result').innerHTML = JSON.stringify(_final)
                console.log(_final)
                _final = {}
            }
        }
    </script>
</body>
</html>
改进了下。。凑合用。

for(var p in objarr){
                    if(objarr[p].p){
                        var pid = objarr[p].p;
                        var selfid = objarr[p].id;
                        if(gettype(objarr[pid].value)=='[object Object]'){
                            objarr[pid].value[selfid] = objarr[p];
                        }else if(gettype(objarr[pid].value)=='[object Array]'){
                            objarr[pid].value.push(objarr[p]);
                        }else{

                        }
                    }
                }
你好请教下这段代码 ie的调试工具显示objarr[pid].value取不到value值，还有就是最后的else里面没有内容还是？

凑合用吧。。最后拼JSON，拼的累死我了。
辛苦了！！！

调试易

jsp 实现生成json串的需求

解决方案 »