从动态列表创建JSON对象

Question

我有一个动态列表并从每一行获取每个对象并将其转换为包含数组的JSON对象。 我不确定如何做到这一点的最佳方法？任何例子都会很棒。

<div id="clientList"> 
    <row id="row_ccf06bc6-75e5-6db5-e7ed-b3f08856fb61"> 
     <label class="col-lg-1 control-label">Name:</label> 
     <div class="col-lg-2"><input type="text" id="ClientName_ccf06bc6-75e5-6db5-e7ed-b3f08856fb61"> 
      <input type="hidden" id="ClientId_ccf06bc6-75e5-6db5-e7ed-b3f08856fb61"> 
    </row> 
    <row id="row_cb5dbc04-62cd-5a19-edf2-2526f7b2aa91"> 
     <label class="col-lg-1 control-label">Name:</label> 
     <div class="col-lg-2"><input type="text" id="ClientName_cb5dbc04-62cd-5a19-edf2-2526f7b2aa91"> 
      <input type="hidden" id="ClientId_cb5dbc04-62cd-5a19-edf2-2526f7b2aa91"> 
    </row> 
</div> 

var Account = new object(); 
$.each(row_??? 
    Account.Clients ='[ClientId: ClientId_???, ClientName: ClientName_???]' 
) 

Answer 1

它将使更有意义的，而不是用含有阵列属性的对象的输出作为对象的数组。考虑到这一点，你可以用map()来实现它：

var arr = $('#clientList row').map(function() { 
 
    var $row = $(this); 
 
    return { 
 
    ClientName: $row.find('input:eq(0)').val(), 
 
    ClientId: $row.find('input:eq(1)').val() 
 
    }; 
 
}).get(); 
 

 
console.log(arr);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="clientList"> 
 
    <row id="row_ccf06bc6-75e5-6db5-e7ed-b3f08856fb61"> 
 
    <label class="col-lg-1 control-label">Name:</label> 
 
    <div class="col-lg-2"> 
 
     <input type="text" id="ClientName_ccf06bc6-75e5-6db5-e7ed-b3f08856fb61" value="Client 1 name" /> 
 
     <input type="hidden" id="ClientId_ccf06bc6-75e5-6db5-e7ed-b3f08856fb61"value="Client 1 id" /> 
 
    </div> 
 
    </row> 
 
    <row id="row_cb5dbc04-62cd-5a19-edf2-2526f7b2aa91"> 
 
    <label class="col-lg-1 control-label">Name:</label> 
 
    <div class="col-lg-2"> 
 
     <input type="text" id="ClientName_cb5dbc04-62cd-5a19-edf2-2526f7b2aa91" value="Client 2 name" /> 
 
     <input type="hidden" id="ClientId_cb5dbc04-62cd-5a19-edf2-2526f7b2aa91" value="Client 2 id"/> 
 
    </div> 
 
    </row> 
 
</div>

请注意，我用:eq()选择从input元素检索值。将类放在这些元素上会使选择更容易，代码变得更脆弱会更好。

你也应该修正你的HTML，因为你错过了几个</div>标签。