• js特效—省市级联


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>js特效—省市级联</title>
    <script>
    //定义省级数组
    var pArray=new Array("北京","上海","天津","山东");
    //定义市级数组
    var cArray=new Array();
    cArray[0]=new Array("东城","西城","从文","宣武","朝阳","丰台");
    cArray[1]=new Array("黄埔","鹿王","长宁","静安","普陀","虹口");
    cArray[2]=new Array("北辰","南开","河西","河东","东丽","和平");
    cArray[3]=new Array("济南","青岛","烟台","潍坊","济宁","泰安");
    //初始化
    function init(){
        var province=document.getElementById("province");
        for(var i=0;i<pArray.length;i++){
            var option=document.createElement("option");
            option.value=pArray[i];
            option.text=pArray[i];
            province.options.add(option);
        }
    }
    function show(){
        var province=document.getElementById("province");
        var city=document.getElementById("city");
        var pSelectedIndex=province.selectedIndex-1;
        var result=document.getElementById("result");
        if(pSelectedIndex<0){
            result.innerText="";
        }
        else{
            result.innerText=pArray[pSelectedIndex];
            var cSelectedIndex=city.selectedIndex-1;
            if(cSelectedIndex>=0){
                result.innerText+=","+cArray[pSelectedIndex][cSelectedIndex];
            }
        }
    }
    function selectProvince(){
        var province=document.getElementById("province");
        var city=document.getElementById("city");
        var pSelectedIndex=province.selectedIndex-1;
        for(var i=city.options.length-1;i>0;i--){
            city.options.remove(i);
        }
        if(pSelectedIndex>=0){
            for(var i=0;i<cArray[pSelectedIndex].length;i++){
                var option=document.createElement("option");
                option.value=cArray[pSelectedIndex][i];
                option.text=cArray[pSelectedIndex][i];
                city.options.add(option);
            }
        }
        show();
    }
    
    </script>
    </head>
    
    <body onLoad="init()" style="font-size:12px;"> 
    <form>
    省份:<select id="province" onChange="selectProvince()">
    <option value="">请选择省份</option>
    </select>
    <br>
    城市:<select id="city" onChange="show()">
    <option value="">请选择城市</option>
    </select>
    <br><br>
    你的选择结果是:<span id="result" style="color:red;"></span></form>
    </body>
    </html>
  • 相关阅读:
    csu1022 菜鸟和大牛 dp
    POJ 1001 Exponentiation
    KMPmatch 字符串模式匹配
    UVaOJ458 The Decoder
    UVaOJ 10300 Ecological Premium
    MLE: 找出出现偶数次的那个数
    csu 1207: 镇管的难题
    csu 1079
    UVaOj 494 Kindergarten Counting Game
    轻松掌握Ajax.net系列教程七:使用ModalPopupExtender
  • 原文地址:https://www.cnblogs.com/chuanzi/p/10888224.html
Copyright © 2020-2023  润新知