如何使用JSON和JQuery在标记中插入元素

Question

$(document).ready(function(){ 

    var Jstr = { 
     "JSON" : [ 
      { 
       "Eid": 101, 
       "Ename": "", 
       "Ecode" : "<h>" + "Ename" + "</h>", 
       "Eprops": {} 
      }, 
      { 
       "Eid": 102, 
       "Ename": "", 
       "Ecode" : "<input type ='text'/>", 
       "Eprops": { 
        "name": "", 
        "value": "", 
        "maxlength": "" 
       } 
      }, 
      { 
       "Eid": 103, 
       "Ename": "", 
       "Ecode" : "<input type ='password'/>", 
       "Eprops": { 
        "value": "", 
        "maxlength": "" 
       } 
      }, 
      { 
       "Eid": 104, 
       "Ename": "", 
       "Ecode" : "<input type ='button' value = '' />", 
       "Eprops": { 
        "value": "" 
       } 
      }, 
      { 
       "Eid": 105, 
       "Ename": "", 
       "Ecode" : "<input type = 'submit' value='submit'/>", 
       "Eprops": { 
        "value": "" 
       } 
      }, 
      { 
       "Eid": 106, 
       "Ename": "", 
       "Ecode" : "<input type = 'radio' />", 
       "Eprops": { 
        "name": "" 
       } 
      }, 
      { 
       "Eid": 107, 
       "Ename": "", 
       "Ecode" : "<input type = 'checkbox'/>", 
       "Eprops": { 
        "name": "" 
       } 
      }, 
      { 
       "Eid": 108, 
       "Ename": "", 
       "Ecode" : "<input type = 'select'/>", 
       "Eprops": { 
        "name": "" 
       } 
      }, 
      { 
       "Eid": 109, 
       "Ename":"", 
       "Ecode" : "<input type = 'reset'/>" , 
       "Eprops": { 
        "name": "" 
       } 
      }, 
      { 
       "Eid": 110, 
       "Ename": "", 
       "Ecode" : "<input type = 'textbox'/>" , 
       "Eprops": { 
        "name": "", 
        "value": "", 
        "maxlength": "" 
       } 
      }, 
      { 
       "Eid": 111, 
       "Ename": "", 
       "Ecode" : "<input type = 'file'/>" , 
       "Eprops": { 
        "id": "" 
       } 
      }, 
     ] 
    }; 

    $(".search").click(function(){ 
     var id = this.id; 
     alert(id); 

     for(var i =0;i<Jstr.JSON.length;i++) { 
      var obj = Jstr.JSON[i]; 

      if(obj.Eid == id) { 
       var pr = $(Jstr.JSON[i].Ecode); 
       alert("Enter Properties"); 

       for(var key in Jstr.JSON[i].Eprops) { 
        pr.attr("key", function(){ 
         //alert("in prop"); 
         var p = prompt(key, ""); 
         return p; 
        }); 
       } 

       var name = prompt("Tag-Name", ""); 
       obj.Ename = name; 
       $('#down').append(obj.Ename); 

       $('#down').append(obj.Ecode); 
       $('#down').append("<br>"); 
      } 
     } 
    }); 
}); 

这是我在其中尝试从JSON对象创建表单元素的jQuery代码。现在的问题是，我没有得到任何方式Eprops的属性附加，在标签内的ECODE

Answer 1

您可以使用<语法jQuery中创建元素：jQuery(html [, ownerDocument ])

第二个参数为这句法可以是一个对象属性名称/值：

Jstr.JSON.forEach(function (elem) { 
    $(elem.Ecode, elem.Eprops).appendTo("body"); 
});