Question

现在克隆的字段集没有像我预期的那样保留前一个字段集中的数据。感谢RobG和ATOzTOA的所有帮助。

我现在唯一的问题是日历在克隆的字段集中无效。

我已经浏览了几个线程，其中人们遇到了与我相同的问题，并为在此主题上创建另一个线程而道歉。

日历下拉列表。

<!-- calendar dropdown -->
<script>
$(document).ready(function() {    
$("#datepicker").datepicker();      
});    
</script>

克隆字段集的脚本。

<!-- clone fieldset -->          
<script>
var _counter = 0;
function Add() {
_counter++;
var oClone = document.getElementById("template").cloneNode(true);
oClone.id += (_counter + "");
document.getElementById("placeholder").appendChild(oClone);
var inputs = oClone.getElementsByTagName('input');
for (var i=0, iLen=inputs.length; 
i<iLen; i++) {
inputs[i].value = '';
}
}
</script>

要克隆的Fieldset。

<div id="placeholder">
<!-- template -->
<div id="template">
<!-- event fieldset -->
<fieldset>           
  <label class="field-first" required>Event: &#42;<input type="text" name="event" value="" /></label>
  <label class="field-first" required>Date: &#42;<input type="text" id="datepicker" name="date" value="" /></label>
  <label class="field-first" required>Net Request Amount: &#42;<input type="text" name="request" value="" /></label>

  <div class="description"><p>Please type a <strong><em>DETAILED</em></strong> description of the item/event/activity:<br /></p></div>

  <textarea name="describe" cols="60" rows="10" required></textarea>
<!-- event fieldset -->
</fieldset>
<!-- template -->      
</div>
<!-- placeholder -->
</div> 
<!-- buttons -->
<button class="right-button" type="submit" name="submit" value="Submit">Submit</button>
<button class="left-button" "btn" type="button" name="Submit"  onclick="Add();">Add New Event</button>

Answer 1

您必须遍历框架集中的每个元素，并将text（）设置为“”。

var div = document.getElementById('template'):
var labels = div.getElementsByTagName('label');
for (var i = 0; i < divs.length; i += 1) {
  code = labels[i].innerHTML;
    // As there is a input element inside the label, we have to modify the HTML code
    codeArray = code.split('&lt');
    codeArray[0] = '';
    code = codeArray.join('&lt;');
    labels[i] = code;
}

Answer 2

据推测，您正在为标签添加内容。您可以使用getElementsByTagName从克隆中获取标签，然后将其innerHTML设置为''（空字符串）以删除任何子节点（或循环子节点并删除它们，但设置innerHTML属性更简单）。在循环标签时，您可以修改可能需要它的任何其他属性。

如果你只想清除输入元素的值，同样的策略只使用getElementsByTagName('input')并将它们的value属性设置为``（空字符串）。

请注意，您有三个名为“first_name”的输入元素。当它们中的任何一个看起来都不是名字时，这似乎不是一个好主意。使用代表它们所持有的数据的名称或其用途。似乎没有必要拥有ID为“datepicker”的ID。删除ID，或者如果需要（unlikley），请修改该值，使其对每个克隆的片段都是唯一的。

修改

使用getElementsByTagName将输入值设置为“”：

var inputs = oClone.getElementsByTagName('input');

for (var i=0, iLen=inputs.length; i<iLen; i++) {
    inputs[i].value = '';
}

清除克隆字段集中的数据

2 个答案:

修改