下拉框选择后调用js要怎么实现?

发布网友发布时间：2022-04-30 18:47

共2个回答

热心网友时间：2022-04-18 02:35

<select onChange="showRight(this.value);">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
</select>
<select id="sub" style="display:none;">
</select>

<script>
function showRight(v){
    var t = document.getElementById('sub');
    document.getElementById('sub').style.display = '';
    switch(v){
        case 'A':
        t.innerHTML = '<option value="_1">A1</option><option value="_2">A2</option>';
        break;
        case 'B':
        t.innerHTML = '<option value="_3">B1</option><option value="_4">B2</option>';
        break;
        case 'C':
        t.innerHTML = '<option value="_5">C1</option><option value="_6">C2</option>';
        break;
    }
}
</script>

热心网友时间：2022-04-18 03:53

这是一个连动下拉框的问题，
1.先定义一个数组{ A{A1,A2} B{B1,B2} c{C1,c2}}
2.在第一个下拉框创建事件，比如选A,动态增加第二个下拉框中的option
即可追问具体代码是什么样的呢？

追答给你看个例子:

--国家--
中国
美国

--城市--

/* 连动下拉框的实现 */
function change(){
//alert("dsfa");
var arry = new Array();
//alert(0);
arry[0]=["成都","北京","天津"];
arry[1]=["纽约","华盛顿","新西兰"];

var val =document.forms[0].elements["country"].value;

var select2 =document.forms[0].elements["city"];
//alert(typeof(select2));
var len = select2.options.length;
//var arry1 = arry[val-1];
if(val==0)
{

for(var i=len;i>0;i--){
select2.remove(i-1);
}
select2.options[0]=new Option("--城市--",0);
return;
}

if(len>1){
for(var k=len;k>1;k--){
select2.remove(k-1);
}}
for(var j=0;j<=arry[val-1].length;j++){
select2.options[j]= new Option(arry[val-1][j],arry[val-1][j]);

}

}