html中有多个选择框,任意选择其中一个,则其他选择框里面的值相对应的改变

图片说明html中有多个选择框,任意选择其中一个,则其他选择框里面的值相对应的改变

6个回答

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
        function change() {
            //获取选择的国家
            var select_value = document.getElementsByName("country")[0].value;
            //获取两个主人公,选择器
            var select1 = document.getElementsByName("main")[0];
            var select2 = document.getElementsByName("main")[1];
            //获取所有选择,
            var all_options = select1.options;
            for (i = 0; i < all_options.length; i++)
                if (all_options[i].id == select_value) {  // 根据option标签的ID来进行判断  测试的代码这里是两个等号
                    all_options[i].selected = true;
                    break;
                }
            all_options = select2.options;
            for (i = 0; i < all_options.length; i++)
                if (all_options[i].id == (select_value + select_value + "")) {//select_value + select_value + ""将获取的id作为字符串进行比较
                    all_options[i].selected = true;
                    break;
                }
        }
    </script>
</head>
<body>

<select name="main">
    <option id="1">曹操</option>
    <option id="2">刘备</option>
    <option id="3">孙权</option>
</select>
<select name="main">
    <option id="11">曹丕</option>
    <option id="22">张飞</option>
    <option id="33">黄盖</option>
</select>
<select name="country" onchange="change()">
    <option id="7" value="1">魏</option>
    <option id="8" value="2">蜀</option>
    <option id="9" value="3">吴</option>
</select>
</body>
</html>

编了个小例子,,对你有帮助,,,请采纳,,

LSQ1092
源份 就不仅仅是只有选蜀的时候,其余2个才会变化,
大约 3 年之前 回复
LSQ1092
源份 我现在的代码实现的就是这个,我想的是,就比如你选择张飞的时候,其余2个框会变成刘备和蜀,选刘备时,会变成张飞和蜀。
大约 3 年之前 回复

联动? 要用javascript控制

LSQ1092
源份 是有点类似于联动,
大约 3 年之前 回复

用javascript控制写个方法,,,给选择框设置一个onchange事件,,,就能触发js方法,,方法中写上你需要干的事情即可

Small_Mouse0
鼠小 回复LSQ1092: 下拉框?一样可以用js做联动的,,,我一会做个例子给你看
大约 3 年之前 回复
LSQ1092
源份 我现在用的就是这种,但是里面的方法该怎么写,,是任意一个选择框改变,其余选择框都要改变,值是一样的
大约 3 年之前 回复

使用jQuery,
$(function(){
//选择框改变响应事件
$("select").change(function(){
$("select").val(this.val());//赋值
}
)
}
)

楼主,你这个是要做计算的,比如当select1的value为1的时候,select2的值就得是一,
按这样的话,你可能要考虑下他们各个selector之间的值得关系,建议百度下三级联动,希望能帮到你

用jquery吧,响应onchange

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐