选择相反的单选按钮时清除复选标记和下拉列表

Clear check mark and dropdowns when opposite radio button is chosen

本文关键字:下拉列表 清除 单选按钮 选择      更新时间:2023-09-26
单击

对面单选按钮时如何清除复选框中的复选标记?由于某种原因,我无法清除它,有人会告诉我我做错了什么吗?我也想知道如何重置下拉列表,如果也有选择,我猜我无法很好地掌握这种语法:/$("#div12 > .clearfix input:select").val(""); 我哪里出错了?

function showhideCOREForm(transferring_vehicle_license) {
    	if (transferring_vehicle_license == "Current") {
        	document.getElementById("div11").style.display = 'block';
        	document.getElementById("div12").style.display = 'none';
			$("#div12 > #secondYearCB").prop("checked", false);
        	FC.wantsASecondYear = false;
    	} else if (transferring_vehicle_license == "Expired") {
        	document.getElementById("div12").style.display = 'block';
        	document.getElementById("div11").style.display = 'none';
			$("#div6 > .clearfix input:text").val("");
		}
	}
<input type="radio" value="Current" name="transferring_vehicle_license" id="transferring_vehicle_license" required="yes" onclick="calculateTotal()" onchange="showhideCOREForm(this.value);"/><label for="transferring_vehicle_license">Current Registration</label>
		<input type="radio" value="Expired" name="transferring_vehicle_license" id="notransferring_vehicle_license" onclick="calculateTotal()" onchange="showhideCOREForm(this.value);"/><label for="notransferring_vehicle_license">Expired Registration</label>
<div id="div12" style="display:none">
	<div class="clearfix">
		<label for='CMonths' class="labelDoubleIndent">Calculate Months:</label>
		<select name="month1" id="month1" size="1">
    		<option value="">Choose a Month</option>
    		<option value="0">January</option>
    		<option value="1">February</option>
    		<option value="2">March</option>
    		<option value="3">April</option>
    		<option value="4">May</option>
    		<option value="5">June</option>
    		<option value="6">July</option>
    		<option value="7">August</option>
    		<option value="8">September</option>
    		<option value="9">October</option>
    		<option value="10">November</option>
    		<option value="11">December</option>
		</select>
		<select name="month2" id="month2" size="1">
    		<option value="">Choose an Option</option>
    		<option value="2">2</option>
    		<option value="14">14</option>
		</select>
		<select name="month3" id="month3" size="1">
    		<option value="">Choose an Option</option>
    		<option value="3">3</option>
    		<option value="15">15</option>
		</select>
		<div id="secondYear" class="labelDoubleIndent">
        	<b>Do you want to add a second year?</b>
        	Yes: <input type="checkbox" name="secondYear" id="secondYearCB" />
    	</div><!-- secondYear -->
	</div>
</div>
<div id="div11" style="display:none">
</div>

您使用了错误的选择器:#secondYearCB不是#div12的第一个孩子。请改用后代选择器:

$('#div12 #secondYearCB').prop("checked", false);

同样的原因是为了select - 选择不是输入!仅使用:

$("#div12 > .clearfix select").val("");

两个选择器都错误地进入了复选框和选择。

复选框,当您在其中使用 ID 时,只需使用 ID:

$("#secondYearCB").prop("checked", false);

选择,它们不是输入,所以只使用"选择"字。

$("#div12 > .clearfix > select").val("");

PS:我添加">"以仅获取".clearfix"div 内的直接选择子项,如果您不想要这个,请将其删除。

选择器:>