嗨，当我选择第二个选项时，我有一个包含不同选择的下拉菜单，有一组是/否单选按钮，一旦我选择"is"，我会显示隐藏字段的 div，然后当我更改下拉列表的值时，我会隐藏这些按钮字段。问题是，当我回到下拉列表中的第二个选择时，"is"单选按钮已被选中，但隐藏字段不会像第一次那样显示，除非我单击"is"单选按钮。当单选按钮已经是"is"时，如何显示隐藏字段？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#tea").hide();
$("#milk").hide();
$("#coffee").hide();
$("#teano").hide();
$("#teayes").hide();
$("#testradio").hide();
$('#q1').click(function() {
if ($(this).val() === 'y') {
$("#testradio").show();
} else if ($(this).val() === 'n') {
$("#testradio").hide();
}
});
$("select").change(function(){
$( "select option:selected").each(function(){
if($(this).attr("value")=="1"){
$("#tea").hide();
$("#milk").show();
$("#testradio").hide();
$("#coffee").hide();
}
if($(this).attr("value")=="2"){
$("#tea").show();
$("#testradio").hide();
$("#milk").hide();
$("#coffee").hide();
}
if($(this).attr("value")=="3"){
$("#tea").hide();
$("#milk").hide();
$("#coffee").show();
$("#testradio").hide();
}
});
}).change();
});
</script>
</head>
<body>
<div>
<select>
<option>Choose beverage</option>
<option value="1">milk</option>
<option value="2">tea</option>
<option value="3">coffee</option>
</select>
</div>
<div id="milk">
milk choices go here</div>
<div id="tea">
caffeine
<INPUT TYPE="radio" NAME="q1" id="q1" VALUE="y">Yes
<INPUT TYPE="radio" NAME="q1" id="q1" VALUE="n">No
</div>
<div id="teayes">
tea yes
</div>
<div id="testradio">
test radio button show
</div>
<div id="teano">
tea no
</div>
<div id="coffee">
coffee goes here</div>
</body>
</html>
最佳答案
快速解决方案:
$('select[name="teas"]').on('change', function (e) {...}).trigger('change');
关于当单选按钮已设置为 yes 时，javascript 在更改下拉菜单时显示隐藏的 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27321527/