2 qq 32390843 qq_32390843 于 2016.03.30 20:38 提问

简单的二级城市联动问题求指导
 <!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title> 
    </head>
    <body>
        <script>
        var cityArr=["上海","北京","湖南","浙江"];
        var county=[["上海"]["北京"]["长沙","衡阳","株洲"]["义务","杭州","宁波"]];
        function showCounty(x,city){
            var id=Number(x.selectedIndex)-1;
            cleanCounty(city);
            addOptions(county[id],city);
        }
        function cleanCounty(city){

                for(var i=city.Option.length-1;i>=0;i--){
                    if(city.Option[i].value!="") 
                        city.remove(i);
                }

        }
        function addOptions(county,city){


                for(var i=0;i<county.length;i++)
                    addOption(city,county[i]);


        }
        function addOption(oListbox, op) {
            var oOption = document.createElement("option");
            oOption.appendChild(document.createTextNode(op));

            if (arguments.length == 2)// 参数数量
            {
                oOption.setAttribute("value", "");
            }
            oListbox.appendChild(oOption);
        }
        window.onload = function(){
            var mainCity1 = document.getElementById("home");
            var areaId = document.getElementById("area");
            cleanCounty(mainCity1);
            addOptions(cityArr, mainCity1);
            mainCity1.selectedIndex = 0;
            areaId.selectedIndex = 0;
        };
        </script>
        <script>
            function checkForm(){

                if(document.form1.username.value==""){
                    alert("用户名不能为空");
                    return false;
                }
                if(document.form1.userpassword1.value==""){
                    alert("用户密码不能为空");
                    return false;
                }
                if(document.form1.userpassword2.value==""){
                    alert("重置密码不能为空");
                    return false;
                }
                return true;
            }
        </script>
    <form action="index.jsp" method="post" name="form1" >
        用户名:<input type="text" name="username" />*(带*的必须填写)<br /><br />
             密码:<input type="password" name="userpassword1" />*<br /><br />
          重置密码:<input type="password" name="userpassword2" />*<br /><br />  

      Email:<input type="text" name="uemail"/>*(将发送注册确认邮件)<br /><br />
                     姓名:<input type="text" name="uname"/><br /><br />
                     性别:<select name="sex" size="1">
                    <option selected value="男">男</option>   
                    <option value="女">女</option> 
               </select>  <br /><br />
                推荐人:<input type="text" name="unamer"/><br /><br />
         地区:<select name="home" id="home">
            <option value="" selected="selected" onchange="showCounty(this,document.getElementById('area'));">-省份-</option>
         </select>   
         <select name="area" id="area">
            <option value="" selected="selected" >-城市-</option>
         </select><br /><br />
         <input type="submit" value="确定" onclick="return checkForm()"/><input type="reset" value="重填"/>
        </form>
    </body>
</html>
程序的初始化函数就无法正确运行 省份不能正确显示    来个好心人指导一下吧

3个回答

devmiao
devmiao   Ds   Rxr 2016.03.30 23:27
showbo
showbo   Ds   Rxr 2016.03.31 09:36

一堆错误。数组项也没用逗号分开,onchange加到option上,options属性写成Option

 <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
</head>
<body>
    <script>
        var cityArr = ["上海", "北京", "湖南", "浙江"];
        ///数组项也没有隔开
        var county = [["上海"],["北京"],["长沙", "衡阳", "株洲"],["义务", "杭州", "宁波"]];
        function showCounty(x, city) {
            var id = Number(x.selectedIndex)- 1;
            cleanCounty(city);
            addOptions(county[id], city);
        }
        function cleanCounty(city) {
            for (var i = city.options.length - 1; i >= 0; i--) {
                if (city.options[i].value != "")
                    city.remove(i);
            }

        }
        function addOptions(county, city) {
            for (var i = 0; i < county.length; i++)
                addOption(city, county[i]);


        }
        function addOption(oListbox, op) {
            var oOption = document.createElement("option");
            oOption.appendChild(document.createTextNode(op));

            if (arguments.length == 2)// 参数数量
            {
                oOption.setAttribute("value", "");
            }
            oListbox.appendChild(oOption);
        }
        window.onload = function () {
            var mainCity1 = document.getElementById("home");
            var areaId = document.getElementById("area");
            cleanCounty(mainCity1);
            addOptions(cityArr, mainCity1);
            mainCity1.selectedIndex = 0;
            areaId.selectedIndex = 0;
        };
    </script>
    <script>
        function checkForm() {

            if (document.form1.username.value == "") {
                alert("用户名不能为空");
                return false;
            }
            if (document.form1.userpassword1.value == "") {
                alert("用户密码不能为空");
                return false;
            }
            if (document.form1.userpassword2.value == "") {
                alert("重置密码不能为空");
                return false;
            }
            return true;
        }
    </script>
    <form action="index.jsp" method="post" name="form1">
        用户名:<input type="text" name="username" />*(带*的必须填写)<br /><br />
        密码:<input type="password" name="userpassword1" />*<br /><br />
        重置密码:<input type="password" name="userpassword2" />*<br /><br />

        Email:<input type="text" name="uemail" />*(将发送注册确认邮件)<br /><br />
        姓名:<input type="text" name="uname" /><br /><br />
        性别:<select name="sex" size="1">
            <option selected value="男">男</option>
            <option value="女">女</option>
        </select>  <br /><br />
        推荐人:<input type="text" name="unamer" /><br /><br />
        地区:<select name="home" id="home" onchange="showCounty(this, document.getElementById('area'));">
    <option value="" selected="selected">-省份-</option>
</select>
        <select name="area" id="area">
            <option value="" selected="selected">-城市-</option>
        </select><br /><br />
        <input type="submit" value="确定" onclick="return checkForm()" /><input type="reset" value="重填" />
    </form>
</body>
</html>
CSDNXIAON
CSDNXIAON   2016.03.30 20:42

城市的二级联动
----------------------同志你好,我是CSDN问答机器人小N,奉组织之命为你提供参考答案,编程尚未成功,同志仍需努力!

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!