Javascript 使用Select进行动态表单输入

正在尝试使用itemz[]处理动态表单字段

我希望表单字段重复，并从json对象中选择填充

   <!-- DYNAMIX ITEMS-->
                               <div class='container1'> 
                                    <tr>
                                                        <td>
                                                            <select id='itemz' name='itemz[]' class='itemz'>    </select>

                                                        </td>   
                                                        <td>
                                                            <input class='form-control' type='text' name='count[]' value=''>
                                                            <input class='form-control' type='hidden' name='weight[]' value='<?= $items['weight']; ?> '>
                                                        </td>

                                                        <!-- ADD MORE -->
                                                        <td>
                                                            <button class='add_form_field'>Add More</button>
                                                        </td>

                                    </tr>
                             </div>

var obj={
产品：[
{
“id”：“1”，
“物品”：“钢琴”，
“重量”：“200”
},{
“id”：“2”，
“物品”：“冰箱”，
“重量”：“50”
},{
“id”：“3”，
“物品”：“冷冻柜”，
“重量”：“100”
},{
“id”：“4”，
“物品”：“沙发”，
“重量”：“20”
},{
“id”：“5”，
“物品”：“微波炉”，
“重量”：“10”
},{
“id”：“6”，
“物品”：“餐桌”，
“重量”：“40”
},{
“id”：“7”，
“物品”：“咖啡桌”，
“重量”：“20”
}
]
};
var max_字段=10；
变量当前_字段=0；
函数添加选项（_el）{
for（对象产品中的var键）{
var text=obj.Prod[key]。项；
var id=obj.Prod[key].id；
var-weight=obj.Prod[key]。权重；
var el=$（''）.text（text）.val（id）.attr（'weight'，weight）；
$（el）.追加（el）；
}
}
函数add_controls（）{
如果（当前字段>=最大字段）{
警报（'max feilds'+max_字段）；
返回false；
}
$（'.container1'）。追加（''）；
添加_选项（$（'.itemz'）.last（））；
$（'.itemz'）.last（）.change（函数（）{
选择更改（此）；
});
$（'.itemz'）.last（）.parent（）.next（）.find（'.remove_字段'）。单击（函数（）{
$（this.parent（）.parent（）.remove（）；
电流场--；
});
当前字段++；
}
功能选择更改（el）{
var curent_weight=$（_el）.children（':selected'）.attr（'weight'）；
var curent_id=$（_el）.children（':selected'）.val（）；
var curent_item=$（_el）.children（':selected'）.text（）；
//设置隐藏的feid值
$（_el）.parent（）.next（）.find（'[name^=“weight”]'）.val（当前权重）；
//你的更多代码。。。
控制台日志（[当前id、当前重量、当前项]）；
}
函数start（）{
添加_选项（$（'.itemz'）.last（））；
$（'.itemz'）.last（）.change（函数（）{
选择更改（此）；
});
}
start（）；
$（'.add_form_field'）。单击（function（）{
添加_控件（）；
});

添加更多
谢谢，这正是我所期待的。荣誉我希望我对每个部分都有更多的了解
      <script>
// POPULATING THE DROP DOWN
var obj={
Prod: 
<?php echo $products; ?>

};

  for(var i=0;i<obj.Prod.length;i++)
{
  var option=$('<option></option>').text(obj.Prod[i]['item']);
    $( ".itemz" ).append(option);
}

 // DUPLICATING THE DROP DOWNS         
$(document).ready(function() {
    var max_fields      = 10; //maximum input boxes allowed
    var wrapper         = $(".container1"); //Fields wrapper
    var add_button      = $(".add_form_field"); //Add button ID

    var x = 1; //initlal text box count
    $(add_button).click(function(e){ //on add input button click
        e.preventDefault();

        if(x < max_fields){ //max input box allowed
            x++; //text box increment
            $(wrapper).append("<tr><td><select id='itemz' name='itemz[]' class='itemz'></select></td>   <td><input class='form-control' type='text' name='count[]' value=''><input class='form-control' type='hidden' name='weight[]' value=''> </td> <td><a href='#' class='remove_field'>Remove</a> </td></tr></div>"); //add input box
        }
    });

    $(wrapper).on("click",".remove_field", function(e){ //user click on remove text
        e.preventDefault(); $(this).parent('div').remove(); x--;
    })
});

      </script>

Prod: 
[{"id":"1","item":"Piano","weight":"200"},{"id":"2","item":"Fridge","weight":"50"},{"id":"3","item":"Freezer","weight":"100"},{"id":"4","item":"Sofa","weight":"20"},{"id":"5","item":"Microwave","weight":"10"},{"id":"6","item":"Dining Table","weight":"40"},{"id":"7","item":"Coffee Table","weight":"20"}]   
};