一个简单js表单检测代码(数据完整的省市二级级联)
注意备忘:不要复制以前的省市级联代码,那里的省市数据不全。
<script> function check_form(){ var name=document.getElementById("lbname").value; var phone=document.getElementById("lbphone").value; var city=document.getElementById("citys").value; var badChar ="ABCDEFGHIJKLMNOPQRSTUVWXYZ"; badChar += "abcdefghijklmnopqrstuvwxyz"; badChar += "0123456789"; badChar += " "+" "; //半角与全角空格 badChar += "`~!@#$%^&()-_=+]\\\\|:;\"\\\'<,>?/"; //不包含*或.的英文符号 if(""==name || name.length<2){ document.getElementById("realm").innerHTML ="请填写汉字"; return false; } if(name.indexOf(".") >= 0 || name.indexOf("。") >= 0){ document.getElementById("realm").innerHTML ="请填写汉字"; return false; } for(var i=0;i<name.length;i++){ //字符串name中的字符 var c = name.charAt(i); if(badChar.indexOf(c) > -1){ document.getElementById("realm").innerHTML ="请填写汉字"; return false } else{ document.getElementById("realm").innerHTML =""; } } if(phone.length!=11){ document.getElementById("phonenumber").innerHTML ="手机号码格式有误"; return false; } else if(phone.substring(0,2)!="13" && phone.substring(0,2)!="14" && phone.substring(0,2)!="15" && phone.substring(0,2)!="18"){ document.getElementById("phonenumber").innerHTML ="手机号码格式有误"; return false; } else if(isNaN(phone)){ document.getElementById("phonenumber").innerHTML ="手机号码格式有误"; return false; } else{ document.getElementById("phonenumber").innerHTML =""; } if(city.length <1){ document.getElementById("place").innerHTML ="请选择所在城市"; return false; } else{ return true; } } </script> <div class="c04"> <div class="c04_wz"> <form action="join.php" method="post" name="join"> <table border="1" cellspacing="0" cellpadding="0" style="border-collapse:collapse;margin:auto;width:900px;"> <tr><td colspan="2" height="15"></td></tr> <tr style="height:30px;line-height:30px;"> <td align="right" width="350">姓 名:</td> <td style="padding-left:10px;" width="540"> <input type="text" name="name" id="lbname" style="width:160px;" /> <span id="realm" style="color:#f00;font-size:12px;"></span> </td> </tr> <tr style="height:30px;line-height:30px;"> <td align="right">手机号码:</td> <td style="padding-left:10px;"> <input type="text" name="phone" id="lbphone" style="width:160px;" onChange="zzjsMobile(document.join.phone.value)" /> <span id="phonenumber" style="color:#f00;font-size:12px;"></span> </td> </tr> <tr style="height:30px;line-height:30px;"> <td align="right">所在城市:</td> <td style="padding-left:10px;"> <select class="bk" name="province" onChange="set_city(this, this.form.city);"> <option value="">选择省</option> <option value="北京市">北京市</option> <option value="上海市">上海市</option> <option value="天津市">天津市</option> <option value="重庆市">重庆市</option> <option value="河北省">河北省</option> <option value="山西省">山西省</option> <option value="辽宁省">辽宁省</option> <option value="吉林省">吉林省</option> <option value="黑龙江省">黑龙江省</option> <option value="江苏省">江苏省</option> <option value="浙江省">浙江省</option> <option value="安徽省">安徽省</option> <option value="福建省">福建省</option> <option value="江西省">江西省</option> <option value="山东省">山东省</option> <option value="河南省">河南省</option> <option value="湖北省">湖北省</option> <option value="湖南省">湖南省</option> <option value="广东省">广东省</option> <option value="海南省">海南省</option> <option value="四川省">四川省</option> <option value="贵州省">贵州省</option> <option value="云南省">云南省</option> <option value="陕西省">陕西省</option> <option value="甘肃省">甘肃省</option> <option value="青海省">青海省</option> <option value="内蒙古">内蒙古</option> <option value="广西">广西</option> <option value="西藏">西藏</option> <option value="宁夏">宁夏</option> <option value="新疆">新疆</option> <option value="中国台湾">中国台湾</option> <option value="中国香港">中国香港</option> <option value="中国澳门">中国澳门</option> </select> <select class="bk" name="city" id="citys" > <option value="">选择城市</option> </select> <span id="place" style="color:#f00;font-size:12px;"></span> <script> function set_city(province, city){ var pv, cv; var i, ii; pv=province.value; cv=city.value; city.length=1; if(pv=='0') return; if(typeof(cities[pv])=='undefined') return; for(i=0; i<cities[pv].length; i++){ ii = i+1; city.options[ii] = new Option(); city.options[ii].text = cities[pv][i]; city.options[ii].value = cities[pv][i]; } } cities = new Object(); cities['北京市']=new Array('北京市'); cities['上海市']=new Array('上海市'); cities['天津市']=new Array('天津市'); cities['重庆市']=new Array('重庆市'); cities['中国台湾']=new Array('中国台湾'); cities['中国香港']=new Array('中国香港'); cities['中国澳门']=new Array('中国澳门'); cities['河北省']=new Array('石家庄', '张家口市', '承德市', '秦皇岛市', '唐山市', '廊坊市', '保定市', '沧州市', '衡水市', '邢台市', '邯郸市'); cities['山西省']=new Array('太原市', '大同市', '朔州市', '阳泉市', '长治市', '晋城市','阳泉市','临汾市','晋中市','运城市','忻州市','朔州市','吕梁市'); cities['辽宁省']=new Array('沈阳市', '朝阳市', '阜新市', '铁岭市', '抚顺市', '本溪市', '辽阳市', '鞍山市', '丹东市', '大连市', '营口市', '盘锦市', '锦州市', '葫芦岛市'); cities['吉林省']=new Array('长春市', '白城市', '松原市', '吉林市', '四平市', '辽源市', '通化市', '白山市', '延边朝鲜族自治州'); cities['黑龙江省']=new Array('哈尔滨市', '齐齐哈尔市', '牡丹江市','佳木斯市', '大庆市', '鸡西市', '双鸭山市', '伊春市', '七台河市', '鹤岗市', '黑河市','绥化市', '大兴安岭地区'); cities['江苏省']=new Array('南京市', '徐州市', '连云港', '宿迁市', '淮阴市', '盐城市', '扬州市', '泰州市', '南通市', '镇江市', '常州市', '无锡市', '苏州市'); cities['浙江省']=new Array('杭州市', '湖州市', '嘉兴市', '舟山市', '宁波市', '绍兴市', '金华市', '台州市', '温州市','衢州市', '丽水市'); cities['安徽省']=new Array('合肥市', '宿州市', '淮北市', '阜阳市', '蚌埠市', '淮南市', '滁州市', '马鞍山市', '芜湖市', '铜陵市', '安庆市', '黄山市', '六安市', '巢湖市','宣城市','池州市','亳州市'); cities['福建省']=new Array('福州市', '南平市', '三明市', '莆田市', '泉州市', '厦门市', '漳州市', '龙岩市', '宁德市'); cities['江西省']=new Array('南昌市', '九江市', '景德镇市', '鹰潭市', '新余市', '萍乡市', '赣州市','吉安市','宜春市','抚州市','上饶市'); cities['山东省']=new Array('济南市', '聊城市', '德州市', '东营市', '淄博市', '潍坊市', '烟台市', '威海市', '青岛市', '日照市', '临沂市', '枣庄市', '济宁市', '泰安市', '莱芜市','滨州市','菏泽市'); cities['河南省']=new Array('郑州市', '三门峡市', '洛阳市', '焦作市', '新乡市', '鹤壁市', '安阳市', '濮阳市', '开封市', '商丘市', '许昌市', '漯河市', '平顶山市', '南阳市', '信阳市','周口市','驻马店市'); cities['湖北省']=new Array('武汉市', '十堰市', '荆门市', '孝感市', '黄冈市', '鄂州市', '黄石市', '咸宁市', '荆州市', '宜昌市', '襄樊市','襄阳市','随州市','恩施土家族苗族自治州'); cities['湖南省']=new Array('长沙市', '张家界市', '常德市', '益阳市', '岳阳市', '株洲市', '湘潭市', '衡阳市', '郴州市', '永州市', '邵阳市', '怀化市', '娄底市', '湘西自治州'); cities['广东省']=new Array('潮州市', '东莞市', '佛山市', '广州市', '河源市', '惠州市', '江门市', '揭阳市', '茂名市', '梅州市', '清远市', '汕头市', '汕尾市', '韶关市', '深圳市', '阳江市', '云浮市', '湛江市', '肇庆市', '中山市', '珠海市'); cities['海南省']=new Array('海口市', '三亚市'); cities['四川省']=new Array('阿坝藏族羌族自治州', '巴中市', '成都市', '达州市', '德阳市', '甘孜藏族自治州', '广安市', '广元市', '乐山市', '凉山彝族自治州', '泸州市', '眉山市', '绵阳市', '内江市', '南充市', '攀枝花市','遂宁市','雅安市','宜宾市','资阳市','自贡市'); cities['贵州省']=new Array('安顺市', '毕节地区', '贵阳市','六盘水市','黔东南苗族侗族自治州','黔南布依族苗族自治州','黔西南布依族苗族自治州','铜仁地区','遵义市'); cities['云南省']=new Array('保山市', '楚雄彝族自治州', '大理白族自治州','德宏傣族景颇族自治州','迪庆藏族自治州','红河哈尼族彝族自治州','昆明市','丽江市','临沧市','怒江傈僳族自治州','曲靖市','思茅市','文山壮族苗族自治州','西双版纳傣族自治州','玉溪市','昭通市'); cities['陕西省']=new Array('西安市', '延安市', '铜川市', '渭南市', '咸阳市', '宝鸡市', '汉中市', '榆林市','安康市','商洛市'); cities['甘肃省']=new Array('白银市', '定西市', '甘南藏族自治州', '嘉峪关市', '金昌市','酒泉市','兰州市','临夏回族自治州','陇南市','平凉市','庆阳市','天水市','武威市','张掖市'); cities['青海省']=new Array('西宁市','果洛藏族自治州','海北藏族自治州','海东地区','海南藏族自治州','海西蒙古族藏族自治州','黄南藏族自治州','玉树藏族自治州'); cities['内蒙古']=new Array('阿拉善盟',' 巴彦淖尔市', '包头市', '赤峰市', '鄂尔多斯市','呼和浩特市','呼伦贝尔市','通辽市','乌海市','乌兰察布市','锡林郭勒盟','兴安盟'); cities['广西']=new Array('百色市', '北海市', '崇左市', '防城港市', '贵港市', '桂林市', '河池市', '贺州市', '来宾市','柳州市','南宁市','钦州市','梧州市','玉林市'); cities['西藏']=new Array('拉萨市','阿里地区','昌都地区','林芝地区','那曲地区','日喀则地区','山南地区'); cities['宁夏']=new Array('银川市', '石嘴山市', '吴忠市','固原市','中卫市'); cities['新疆']=new Array('乌鲁木齐市', '克拉玛依市','阿克苏地区','阿勒泰地区','巴音郭楞蒙古自治州','博尔塔拉蒙古自治州','昌吉回族自治州','哈密地区','和田地区','喀什地区','克孜勒苏柯尔克孜自治州','省直辖行政单位','塔城地区','吐鲁番地区','伊犁哈萨克自治州'); </script> </td> </tr> <tr><td colspan="2" height="10"></td></tr> <tr style="height:35px;line-height:35px;"> <td align="right"><input type="p_w_picpath" src="p_w_picpaths/sub.jpg" check_form();" /></td> <td style="padding-left:20px;"><a href="" target="_blank"><img src="p_w_picpaths/down.jpg" border="0" /></a></td> </tr> <tr><td colspan="2" height="10"></td></tr> </table> </form>
注:省市这里最好用ajax实现,这样也可以避免省市有数据不全的情况。