任务一:
字段 |
规则及提示 |
用户名 |
1、不能为空 2、6~18位字符,只能包含英文字母、数字、下划线 |
密码 |
1、不能为空 2、6-16位字符,可包含数字,字母(区分大小写) |
js代码:
function check(){
var name = document.getElementById("uname").value;
var pwd = document.getElementById("upwd").value;
if(name==""){
alert("用户名不能为空!");
return false;
}else if(name.length<6||name.length>18){
alert("用户名只能为6~18位字符!");
return false;
}else{
for(var i = 0; i<name.length; i++){
if(! ( name.charCodeAt(i)>='0'.charCodeAt()&&name.charCodeAt(i)<='9'.charCodeAt() ) ||
( name.charCodeAt(i)>='a'.charCodeAt()&&name.charCodeAt(i)<='z'.charCodeAt() ) ||
( name.charCodeAt(i)>='A'.charCodeAt()&&name.charCodeAt(i)<='Z'.charCodeAt() ) ||
( name.charCodeAt(i)=='_'.charCodeAt() ) ) {
alert("用户名只能包含英文字母、数字、下划线!");
return false;
}
}
}
if(pwd==""){
alert("密码不能为空!");
return false;
}else if(pwd.length<6||pwd.length>16){
alert("密码只能为6~16位字符!");
return false;
}else{
for(var i = 0; i<pwd.length; i++){
if(! ( pwd.charCodeAt(i)>='0'.charCodeAt()&&pwd.charCodeAt(i)<='9'.charCodeAt() ) ||
( pwd.charCodeAt(i)>='a'.charCodeAt()&&pwd.charCodeAt(i)<='z'.charCodeAt() ) ||
( pwd.charCodeAt(i)>='A'.charCodeAt()&&pwd.charCodeAt(i)<='Z'.charCodeAt() ) ) {
alert("密码只能包含英文字母、数字!");
return false;
}
}
}
return true;
}
任务二:
字段 |
规则及提示 |
学号 |
1、不能为空 2、8数字,前面两位为入学年份,例如:14831102 代表该学生是14年入学的。 |
姓名 |
不能为空 |
性别 |
必选 |
出生日期 |
符合日期格式 例如:2008-01-01 2008/01/01 2008-1-1 2008/1/1 |
政治面貌 |
必选 |
入学年份 |
符合年份的格式 例如:1999 2000 |
籍贯 |
必选 |
特长 |
必选,如果选择 其他 ,则 文本框为必须填写。 |
备注 |
必输 |
js代码:
<script type="text/javascript">
function check() {
var num = document.getElementById("num").value;
var name = document.getElementById("name").value;
var birthday = document.getElementById("birthday").value;
var zhengzhi = document.getElementById("zhengzhi");
var bysch = document.getElementById("bysch").value;
var sheng = document.getElementById("sheng");
var shi = document.getElementById("shi");
var xian = document.getElementById("xian");
var address = document.getElementById("address").value;
var beizhu = document.getElementById("beizhu").value;
//学号格式
if(num==""){
alert("学号不能为空!");
return false;
}else if(num.length!=8){
alert("学号为8位!");
return false;
}else{
for(var i = 0; i<num.length; i++){
if(! ( num.charCodeAt(i)>='0'.charCodeAt() && num.charCodeAt(i)<='9'.charCodeAt() ) )
{
alert("学号只能是数字!");
return false;
}
}
}
//姓名格式
if(name==""){
alert("姓名不能为空!");
return false;
}
//出生日期格式
if(birthday.length!=10){
alert("出生日期格式不对!");
return false;
}else{
var flag = true;
for(var i = 0; i<4; i++){
if(! ( birthday.charCodeAt(i)>='0'.charCodeAt()&&birthday.charCodeAt(i)<='9'.charCodeAt() ))
{
alert("出生日期格式不对!");
flag = false;
return false;
}
}
if(flag){
for(var i = 5; i<7; i++){
if(! ( birthday.charCodeAt(i)>='0'.charCodeAt()&&birthday.charCodeAt(i)<='9'.charCodeAt() ))
{
alert("出生日期格式不对!");
flag = false;
return false;
}
}
for(var i = 8; i<10; i++){
if(! ( birthday.charCodeAt(i)>='0'.charCodeAt()&&birthday.charCodeAt(i)<='9'.charCodeAt() ))
{
alert("出生日期格式不对!");
flag = false;
return false;
}
}
if(!( (birthday.charCodeAt(4)=='-'.charCodeAt()&&birthday.charCodeAt(7)=='-'.charCodeAt())||
(birthday.charCodeAt(4)=='/'.charCodeAt()&&birthday.charCodeAt(7)=='/'.charCodeAt()) )){
alert("出生日期格式不对!");
return false;
}
}
}
//政治面貌
if(zhengzhi.value == ""){
alert("请选择您的政治面貌");
return false;
}
//入学年份格式
if(bysch.length!=4){
alert("入学年份格式格式不对!");
return false;
}else{
for(var i = 0; i<bysch.length; i++){
if(! ( bysch.charCodeAt(i)>='0'.charCodeAt()&&bysch.charCodeAt(i)<='9'.charCodeAt() ))
{
alert("入学年份格式不对!");
return false;
}
}
}
//籍贯
if(sheng.value == ""){
alert("请选择您的籍贯省");
return false;
}
if(shi.value == ""){
alert("请选择您的籍贯市");
return false;
}
if(xian.value == ""){
alert("请选择您的籍贯县/区");
return false;
}
if(address == ""){
alert("请输入您的籍贯地址");
return false;
}
//特长
if( !( (document.getElementById("book").checked) || (document.getElementById("paint").checked) ||
(document.getElementById("write").checked) || (document.getElementById("sport").checked) ||
(document.getElementById("other").checked) )){
alert("请选择您的特长!");
return false;
}
if(document.getElementById("other").checked ){
if(document.getElementById("others").value == ""){
alert("请输入您的其他特长!");
return false;
}
}
//备注
if(beizhu==""){
alert("备注不能为空!");
return false;
}
return true;
}
</script>
form表单:
<form onsubmit="return check()">
学 号<input type="text" id="num" name="num" ><br>
姓 名<input type="text" id="name" name="name"><br>
性 别<input type="radio" id="sex" name="sex" value="男" checked="checked" >男
<input type="radio" id="sex" name="sex" value="女" >女<br>
出生日期<input type="text" id="birthday" name="birthday" ><br>
政治面貌
<select id="zhengzhi" name="zhengzhi">
<option value="">请选择</option>
<option value="1">中共党员</option>
<option value="2">共青团员</option>
</select><br>
入学年份<input type="text" id="bysch" name="bysch"><br>
籍 贯
<select id="sheng" name="sheng">
<option value="">请选择省</option>
<option value="1">山东省</option>
<option value="2">江苏省</option>
</select>
<select id="shi" name="shi">
<option value="">请选择市</option>
<option value="1">济南市</option>
<option value="2">淄博市</option>
</select>
<select id="xian" name="xian">
<option value="">请选择县/区</option>
<option value="1">张店区</option>
<option value="2">淄川区</option>
</select><br>
<input type="text" id="address" name="address"><br>
特 长
<input type="checkbox" name="tech" id="book" value="书法" >书法
<input type="checkbox" name="tech" id="paint" value="绘画" >绘画
<input type="checkbox" name="tech" id="write" value="写作" >写作
<br>
<input type="checkbox" name="tech" id="sport" value="体育" >体育
<input type="checkbox" name="tech" id="other" value="其他" >其他
<input type="text" id="others" name="others" ><br>
备 注
<textarea rows="" cols="" id="beizhu" name="beizhu"></textarea><br>
<input type="submit" id="add" name="add" value="添加">
<input type="reset" value="清除">
</form>