Javascript 使用克隆时，如何保持动态添加的子元素的唯一性？

因此，我刚刚设法通过使用javascript和jquery来动态添加特定形式的行和子行。目前的布局如下图所示

在HTML中，此部分的

如下所示：

<div class="controls">
   <form role="form" autocomplete="off">
      <div class="entry">
         <div class="col-sm-5">
            <input id="medication_name" name="names[]" type="text" class="form-control input-lg margin_top" placeholder="Name medication">
         </div>
         <div class="col-sm-6">
            <select id="medication_type" name="types[]" class="form-control input-lg margin_top">
               <option value="" disabled selected>Type</option>
               <option value="short" style="color:#FF8000">Shortworking insulin</option>
               <option value="long" style="color:#00B058">Longworing insulin</option>
               <option value="other" style="color:#64B5F6">Other</option>
            </select>
         </div>
         <div class="col-sm-1">
            <button class="btn btn-success btn-add input-lg margin_top" type="button">
            <span class="glyphicon glyphicon-plus"></span>
            </button>
         </div>
         <!-- SUB ENTRY START -->
         <div class="subentry">
            <div class="col-sm-3">
               <input id="time_amount" name="amount[]" type="text" class="form-control input margin_top" placeholder="Amount">
            </div>
            <div class="col-sm-8">
               <select id="time_type" name="times[]" class="form-control input margin_top">
                  <option value="" disabled selected>Time of day</option>
                  <option value="morning">in the morning</option>
                  <option value="noon" >at noon</option>
                  <option value="evening">in the evening</option>
                  <option value="food">with food</option>
                  <option value="bed">before bed</option>
               </select>
            </div>
            <div class="col-sm-1">
               <button class="btn btn-info btn-add-time input margin_top" type="button">
               <span class="glyphicon glyphicon-plus"></span>
               </button>
            </div>
         </div>
         <!-- SUB ENTRY END -->
      </div>
   </form>
</div>

如您所见，我克隆了包含表单元素的

s，用于新药物或新药物服用时间。现在是我的实际问题。我知道我可以使用以下示例循环遍历名称数组（name=“names[]”）：

$('input[name^="names"]').each(function() {
    console.log(!$(this).val());
});

---

这可以为我的所有数组完成：名称[]、类型[]、金额[]、类型[]。但我的问题是，就像我之前说过的，我不知道什么时候是什么药物，因为它们不是以某种方式耦合的，它们只是被添加到数组中。因此，如果我循环遍历amounts[]和times[]数组，我将不知道哪种药物的时间。也许你们中有人知道一个解决方案，或者知道如何编辑代码，这样就可以了？非常感谢。

听起来您需要一个对象数组，而不是多个元素不匹配的数组。谢谢！你能给我举个例子吗？这是我第一次使用JQuery进行开发，所以这不会立即给我敲响警钟。

$('input[name^="names"]').each(function() {
    console.log(!$(this).val());
});