qq_32390843
qq_32390843
2016-03-30 12:38
采纳率: 50%
浏览 1.3k

简单的二级城市联动问题求指导

 <!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>
程序的初始化函数就无法正确运行 省份不能正确显示    来个好心人指导一下吧
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

2条回答 默认 最新

  • devmiao
    devmiao 2016-03-30 15:27
    点赞 评论
  • showbo

    一堆错误。数组项也没用逗号分开,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>
    
    点赞 评论

相关推荐