我有两个状态下拉列表。在两个下拉菜单项中,都有两个州阿拉斯加和加利福尼亚。如果我从下拉列表中选择任何一项,则单击单选按钮,因此另一个下拉列表必须具有相同的选择。谁能帮我吗?谢谢
<form>
<select id="state1" name="state1">
<option value="Alaska">Alaska</option>
<option value="California">California</option>
</select>
<select id="state2" name="state2">
<option value="Alaska">Alaska</option>
<option value="California">California</option>
</select>
<input type="radio" id="yes" name="yesNo" onclick="yesnoCheck()" value="yes" />
</form>
JavaScript Code
<script>
var state= document.getElementById("state");
var selectedText = state.options[state.selectedIndex].text;
var state1= document.getElementById("state1");
var selectedText1 = state.options[state.selectedIndex].text;
selectedText1 =selectedText;
</script>
答案 0 :(得分:2)
您只需在单击单选按钮时将第一个选择的值分配给第二个选择即可。
var stateSelect1 = document.getElementById("state1");
var stateOption1 = document.getElementById("yes");
var stateSelect2 = document.getElementById("state2");
stateOption1.onclick = function(){
stateSelect2.value = stateSelect1.value
}
<form>
<select id="state1" name="state1">
<option value="Alaska">Alaska</option>
<option value="California">California</option>
</select>
<select id="state2" name="state2">
<option value="Alaska">Alaska</option>
<option value="California">California</option>
</select>
<input type="radio" id="yes" name="yesNo" value="yes" />
</form>
答案 1 :(得分:1)
如果选中此框,则该值将被设置为第一次选择时的值。
在后端,您必须将yes或no更改为true或false。
<form>
<select id="state1" name="state1">
<option value="Alaska">Alaska</option>
<option value="California">California</option>
</select>
<select id="state2" name="state2">
<option id="state2_Alaska" value="Alaska">Alaska</option>
<option id="state2_California" value="California">California</option>
</select>
<input id="radioCheck" type="checkbox" name="yesNo" />
</form>
<script>
document.querySelector("#radioCheck").addEventListener("change", function() {
if(document.querySelector("#radioCheck").value == true){
var state = document.querySelector("#state1").value;
document.querySelector("#state2_" + state).setAttribute("selected", true);
}
});
</script>