在我的代码中，我使用代码片段中的代码根据用户输入创建字段集的重复副本。我现在的问题是，当用户提交表单时，参数哈希不会考虑字段集不同实例的值。最后一个值将覆盖所有先前的值。作为当前场景中的示例，下面是 params Hash。
{ "member"=>"2", "lte_freq1"=>"4", "ru_type"=>"RRU", "4_way_rx"=>"No"}
但是，我想要的输出如下所示。这里 member =2 的值因此附加了两个 fieldset 实例:
{ "member"=>"2", "lte_freq1_1"=>"6", "ru_type_1"=>"RU",
"4_way_rx_1"=>"Yes", "lte_freq1_2"=>"4", "ru_type_2"=>"RRU",
"4_way_rx_2"=>"No" }
$(document).ready(function(){
$("button").click(function(){
var number = document.getElementById("member").value;
var repeat = $('fieldset');
var cloned;
for (i=1;i<number;i++){
cloned = repeat.clone(true);
cloned.appendTo('.sector_prop');
}
});
});<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<br>
<br>
<br>
<br>
</head>
<body>
<form action="/form" method="post">
<div class="textbox">
<legend><b> RF Parameters</b></legend>
<br>
Number of Sectors (LTE)<br>
<br>
<input type="text" id="member" name="member" value="">
<br>
<br>
<button>Generate Sector Properties</button>
<br>
<br>
<div class="sector_prop">
<fieldset>
Primary LTE Carrier (Select lowest frequency on the site 850 for Band 5, AWS
for Band 4 and PCS for Band 2)<br>
<br>
<select name="lte_freq1">
<option value="6">850</option>
<option value="2">AWS</option>
<option value="4">PCS</option>
</select>
<br>
<br>
Radio Type (Select "RU" for Rack-mount or RRU for Remote-Radio):<br>
<br>
<select name="ru_type">
<option value="RU">RU</option>
<option value="RRU">RRU</option>
</select>
<br>
<br>
4 way Rx (Select "Yes" or "No"):<br>
<br>
<select name="4_way_rx">
<option value="Yes">Yes</option>
<option value="No">No</option>
</select>
<br>
<br>
</fieldset>
</div>
<br>
<input type="submit">
</form>
<br>
<br>
</body>最佳答案
您正在克隆元素，它不会神奇地更新字段名称。因此，您需要在克隆时手动获取索引并更新新元素的名称:
$(document).ready(function(){
$("button").click(function(){
var number = document.getElementById("member").value;
var repeat = $('fieldset');
var cloned;
for (i=1;i<number;i++){
cloned = repeat.clone(true);
current_name = cloned.find('select').attr('name');
cloned.find('select').prop('name', current_name + '_' + i);
cloned.appendTo('.sector_prop');
}
});
});
关于javascript - 在 for 循环中更改 HTML <select> 表单属性的名称，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44995135/