untitled.html

来自「实现层的隐藏与显示,功能比较完善,请大家一定要下下来好好研究」· HTML 代码 · 共 114 行

HTML
114 行
字号 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script language="javascript">
	function checkUserName(){
		var names = document.form1.textfield.value;
		var layer = document.getElementById("userName");
		if(names.length==0){
			layer.innerHTML="<font color='red' size=2>用户名不能为空</font>";			
			return false;
		}
		if(names.length<6 || names.length>20){
			layer.innerHTML="<font color='red' size=2>用户名长度不能超过20或者不能小于6</font>";
			return false;
		}
		layer.innerHTML="<font color='blue' size=2>用户名可用</font>";
		return true;
	}
	var cityList = new Array();
		cityList["请选择省份"] = ["请选择城市"];
		cityList['北京市'] = ['北京市','朝阳区','东城区','西城区', '海淀区','宣武区','丰台区','怀柔','延庆','房山'];
	 cityList['上海市'] = ['上海市','宝山区','长宁区','丰贤区', '虹口区','黄浦区','青浦区','南汇区','徐汇区','卢湾区'];
	 cityList['广州省'] = ['广州省','广州市','惠州市','汕头市','珠海市','佛山市','中山市','东莞市'];
         cityList['深圳市'] = ['深圳市','福田区', '罗湖区', '盐田区', '宝安区', '龙岗区', '南山区', '深圳周边'];
	 cityList['重庆市'] =['重庆市','俞中区', '南岸区', '江北区', '沙坪坝区', '九龙坡区', '渝北区', '大渡口区', '北碚区'];
         cityList['天津市'] = ['天津市','和平区', '河西区', '南开区', '河北区', '河东区', '红桥区', '塘古区', '开发区'];
	 cityList['江苏省'] = ['江苏省','南京市','苏州市','无锡市'];
	 cityList['浙江省'] = ['浙江省','杭州市','宁波市','温州市'];
	 cityList['四川省'] = ['四川省','成都市'];
	 cityList['海南省'] = ['海南省','海口市'];
	 cityList['福建省'] = ['福建省','福州市','厦门市','泉州市','漳州市'];
	 cityList['山东省'] = ['山东省','济南市','青岛市','烟台市'];
	 cityList['江西省'] = ['江西省','南昌市'];
	 cityList['广西'] = ['广西','南宁市'];
	 cityList['安徽省'] = ['安徽省','合肥市'];
	 cityList['河北省'] = ['河北省','石家庄市'];
	 cityList['河南省'] = ['河南省','郑州市'];
	 cityList['湖北省'] = ['湖北省','武汉市','宜昌市'];
	 cityList['湖南省'] = ['湖南省','长沙市'];
	 cityList['陕西省'] = ['陕西省','西安市'];
	 cityList['山西省'] = ['山西省','太原市'];
	 cityList['黑龙江省'] = ['黑龙江省','哈尔滨市'];
	 cityList['国外'] = ['国外'];
	 cityList['其他'] = ['其他'];
	function changeProvince(){
		document.form1.setcity.options.length=0;
		var values = document.form1.setprovince.value;
		alert(values);
		for(var result in cityList[values]){
			document.form1.setcity.options.add(new Option(cityList[values][result]));
		}
	}
	function addprovince(){
		for(var i in cityList)
		{
			document.form1.setprovince.options.add(new Option(i,i));
		}
		document.form1.setcity.options.add(new Option(cityList["请选择省份"][0]));
		document.form1.setprovince.selectedIndex=0;	
		document.form1.setcity.selectedIndex=0;
	}
	window.onload = addprovince;
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
  <table width="567" height="154" border="1">
    <tr>
      <td width="83">用户名</td>
      <td width="178"><label>
        <input type="text" name="textfield" onblur="checkUserName()" />
      </label></td>
      <td width="284"><div id="userName"></div></td>
    </tr>
    <tr>
      <td>密码</td>
      <td><input type="password" name="textfield2" /></td>
      <td><div id="pwdone"></div></td>
    </tr>
    <tr>
      <td>确认密码</td>
      <td><input type="password" name="textfield3" /></td>
      <td><div id="pwdtwo"></div></td>
    </tr>
    <tr>
      <td>电子邮件地址</td>
      <td><input type="text" name="emails" /></td>
      <td><div id="div3"></div></td>
    </tr>q
    <tr>
      <td>城市</td>
      <td><label>
        <select name="setprovince" style="width:80px;" onchange="changeProvince()">
			
        </select>
        <select name="setcity" style="width:80px;">
			
        </select>
      </label></td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
  </table>
</form>
</body>
</html>

untitled.html - 源码说明

本页面展示了「实现层的隐藏与显示,功能比较完善,请大家一定要下下来好好研究」中的 untitled.html 源码文件，采用 HTML 编程语言编写，共 114 行代码。您可以在线阅读完整代码内容，也可以返回资源详情页下载完整源码包进行本地学习和开发。

虫虫开发者社区收录了大量与DOM操作相关的技术资源，包括源代码、技术文档、电路图等，是电子工程师和嵌入式开发者的专业学习平台。

⌨️ 快捷键说明

复制代码Ctrl + C
搜索代码Ctrl + F
全屏模式F11
增大字号Ctrl + =
减小字号Ctrl + -
显示快捷键?