js实现三级联动

HTML：

省：<select name="" id="s_city">
    <option value="">--请选择--</option>
</select>
市：<select name="" id="ss_city">
    <option value="">--请选择--</option>
</select>
区：<select name="" id="q_city">
    <option value="">--请选择--</option>
</select>

js:

var sheng=["陕西省","甘肃省","四川省"]
    var shi=[
        ["西安市","咸阳市","宝鸡市"],
        ["兰州市","酒泉市","天水市"],
        ["成都市","绵阳市","攀枝花市"]
    ]
    var qu=[
        [
            ["长安区","未央区","雁塔区"],
            ["秦都区","渭城区","三原县"],
            ["金台区","成仓区","渭滨区"]
        ],
        [
            ["兰州市1","兰州市2","兰州市3"],
            ["酒泉市1","酒泉市2","酒泉市3"],
            ["天水市1","天水市2","天水市3"]
        ],
        [
            ["锦江区","青羊区","武侯区"],
            ["游仙区","江油区","梓潼县"],
            ["东区","西区","仁和区"]
        ]
    ]
    var shengcity=document.getElementById("s_city");
    for(var i=0;i<sheng.length;i++){
        var option=new Option(sheng[i],i);
        shengcity.appendChild(option);
    }
    var shicity=document.getElementById("ss_city");
    var s_index=0;
    shengcity.onchange=function(){
        qucity.options.length=1;
        shicity.options.length=1;
        s_index=this.value;
        for(var i=0;i<shi[this.value].length;i++){
            var option=new Option(shi[this.value][i],i);
            shicity.appendChild(option);
        }
    }
    var qucity=document.getElementById("q_city");
    shicity.onchange=function(){
        qucity.options.length=1;
        for(var i=0;i<qu[s_index][this.value].length;i++){
            var option=new Option(qu[s_index][this.value][i],i);
            qucity.appendChild(option);
        }
    }