我有一个网页表单显示了许多问题。最近有报道称,在表格的条件部分显示的一个问题是,当用于显示该问题的条件被满足、然后没有满足和再次满足时,保留其值。
也就是说,如果用户对问题1回答“是”,问题1a&1b将被显示;如果他们将问题1的答案更改为“否”,问题1a&1b将被隐藏;但是如果他们将问题1的答案更改回“是”,问题1a&1b将再次显示,并且之前给出的答案仍处于选中状态。1a&1b一旦再次隐藏和显示,则应返回空白/空值。
如果(a)和(b)是具有以下代码的下拉表单元素,则当隐藏并重新显示时,我设法将(a)和(b)部分的答案清空:
function() {
var hiddenF = "conbox_" + ID;
var hiddenwrapper = $("." + hiddenF).css('display', 'none');
var dd = hiddenwrapper.children('select[id^="dropdown"]');
dd.val('');
...
}
但是,表单由许多不同类型的字段组成,我当前在清除复选框列表的所选选项(可以选择多个复选框)时遇到了一些困难。
我试图用与下拉列表类似的方式清除选择:
var cb = hiddenwrapper.children('select[id^="checkbox"]');
cb.checked = false;
但是,当我通过选择“是”和“否”作为问题1的答案来隐藏并重新显示带有复选框“答案”的问题时,重新显示问题时仍会选中以前选中的复选框。
我添加的用于显示
cb.checked
将其设置为false后,会显示其值为false,但复选框本身实际上仍处于选中状态:
CB:
检查:假
长度:0
当问题隐藏并重新显示时,如何清除选中的复选框?
编辑
显示此内容的页面的HTML为:
<body id="container">
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div class="main">
<div class="maincontent">
<asp:Panel ID="Panel2" runat="server">
...
</asp:Panel>
<asp:Panel ID="Panel1" runat="server">
</asp:Panel>
</div>
</div>
</form>
</body>
表单显示在面板1中。
为此面板生成的HTML是:
<div id="Panel1">
<div id="ReportPanel1" class="hide">
<span id="section1"><h3>1) Intro</h3></span><span id="section1_1"><p><b>Is Today Monday? <span class='red'>*</span></b></p></span><div class="radiobox">
<table id="radio1_1" border="0">
<tr>
<td><input id="radio1_1_0" type="radio" name="radio1_1" value="Yes" data-validation="required" onchange="showhiddenconditions(radio1_1,'radio');" data-aid="396439" /><label for="radio1_1_0">Yes</label></td>
</tr><tr>
<td><input id="radio1_1_1" type="radio" name="radio1_1" value="No" data-validation="required" onchange="showhiddenconditions(radio1_1,'radio');" data-aid="396440" /><label for="radio1_1_1">No</label></td>
</tr>
</table>
</div><div id="conbox_1_2_396439" class="conbox_396439" style="display:none">
<span id="section1_2"><p><b>Which games did you watch? </b></p></span><div class="radiobox">
<table id="checkbox1_2" class="textbox3" border="0">
<tr>
<td><input id="checkbox1_2_0" type="checkbox" name="checkbox1_2$0" /><label for="checkbox1_2_0">Wales</label></td>
</tr><tr>
<td><input id="checkbox1_2_1" type="checkbox" name="checkbox1_2$1" /><label for="checkbox1_2_1">England</label></td>
</tr><tr>
<td><input id="checkbox1_2_2" type="checkbox" name="checkbox1_2$2" /><label for="checkbox1_2_2">Scotland</label></td>
</tr><tr>
<td><input id="checkbox1_2_3" type="checkbox" name="checkbox1_2$3" /><label for="checkbox1_2_3">Ireland</label></td>
</tr><tr>
<td><input id="checkbox1_2_4" type="checkbox" name="checkbox1_2$4" /><label for="checkbox1_2_4">France</label></td>
</tr><tr>
<td><input id="checkbox1_2_5" type="checkbox" name="checkbox1_2$5" /><label for="checkbox1_2_5">Italy</label></td>
</tr>
</table>
</div>
</div><div id="conbox_1_3_396439" class="conbox_396439" data-type="drop" data-control="dropdown1_3" style="display:none">
<span id="section1_3"><p><b>Did you watch the rugby? <span class='red'>*</span></b></p></span><input type="hidden" name="HiddenRequired_1_3_396439" id="HiddenRequired_1_3_396439" value="dropdown1_3" /><select name="dropdown1_3" id="dropdown1_3" class="textbox3">
<option value="">...</option>
<option value="396443">No</option>
<option value="396444">Yes</option>
</select>
</div><div id="conbox_1_4_396439" class="conbox_396439" data-type="drop" data-control="dropdown1_4" style="display:none">
<span id="section1_4"><p><b>Did you have a good weekend? </b></p></span><select name="dropdown1_4" id="dropdown1_4" class="textbox3">
<option value="">...</option>
<option value="396442">No</option>
<option value="396441">Yes</option>
</select>
</div><input type="submit" name="next1" value="Submit >" id="next1" class="buttonSubmit loginoveride2" />
</div>