下面的 jquery 代码将在页面加载时隐藏以 -value-wrapper 结尾的 div。我的问题是,“添加更多值”按钮将附加另一行(数字增加)。当它出现时,所有的 div 都会显示出来。有没有办法把原来的隐藏起来,把新的也隐藏起来?
html 标记如下所示:
<div id="group-information-items">
<fieldset>
<legend>Member Information</legend>
<label>Form label 1</label>
<table>
<tr>
<td>
<div class="form-radios">
<input type="radio" class="form-radio" checked="checked" value="0" name="gci[0][fa][value]" id="edit-gci-value-0"> A
<input type="radio" class="form-radio" value="1" name="gci[0][fa][value]" id="edit-gci-value-0">B
</div>
<!-- This is the div that is hidden -->
<div id="edit-gci-0-fa-list-value-wrapper" class="form-item">
<label>List: </label>
<textarea name="gci[0][fa_list][value]" rows="5" cols="60"></textarea>
</div>
</td>
</tr>
</table>
<!-- WHEN THIS BUTTON IS CLICKED, A CLONE OF THE ROW ABOVE IS APPENDED TO THE TABLE -->
<!-- THE ONLY DIFFERENCE IS [0] BECOMES [1] AND SO ON -->
<div class="content-add-more clear-block">
<input type="submit" value="Add more values" id="edit-gci-add-more" name="gci_add_more">
</div>
</fieldset>
</div>
执行初始隐藏的代码如下:
$("#group-information-items div").each(function() {
$("div[id$='-value-wrapper']").each(function() {
$(this).hide();
});
});