<head>
<title>表单页面</title>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<script type="text/javascript">
//onsubmit时间驱动
function checkForm(){
//检测表单
var flag=true;//标志位验证是否通过
flag=checkNull("usename","用户名不能为空")&&flag;
flag=checkNull("password","密码不能为空")&&flag;
flag=checkNull("password","确认密码不能为空")&&flag;
flag=checkNull("nickname","昵称不能为空")&&flag;
flag=checkNull("email","邮箱不能为空")&&flag;
flag=checkNull("img","头像不能为空")&&flag;
flag=checkNull("valistr","验证码不能为空")&&flag;
flag=checkGenderAndLike("gender","性别不能为空")&&flag;
flag=checkGenderAndLike("like","爱好不能为空")&&flag;
flag=checkGenderAndLike("password","两次密码不一致")&&flag;
flag=checkEmail("email","邮箱格式不正确");
return flag;
}
//判定邮箱格式,正则表达式
function checkEmail(name,msg){
var email=document.getElementsByName(name)[0].value;
setMsg(name,"");
if(email==""){
setMsg(name,"邮箱不能为空");
}else{
var reg=/^\w+@\w+(\.\w+)+$/;
if(!reg.test(email)){
setMsg(name,msg);
return false;
}
}
return true;
}
//前端:非空校验
function checkNull(name,msg){
var value=document.getElementsByName(name)[0].value;
setMsg(name,"");
if(value==""){
//alert(msg);
setMsg(name,msg);
return false;
}
}
//判定两次密码是否一致
function checkPassword(name,msg){
var psw=document.getElementsByName(name)[0].value;
var psw2=document.getElementsByName(name+"2")[0].value;
setMsg(name+"2","");
if(psw2==""){
setMsg(name+"2","确认密码不能为空");
return false;
}
if(psw!=""&&psw2!=""&&psw!=psw2){
setMsg(name+"2",msg);
return false;
}
return true;
}
//判定性别爱好是否为空
function checkGenderAndLike(name,msg){
var flag=false;
//获取所有的选框遍历,只要有一个选中,flagtrue
var objs=document.getElementsByName(name);
for(var i=0;i<objs.length;i++){
if(objs[i].checked){
flag=true;
}
}
setMsg(name,"");
if(!flag){
setMsg(name,msg);
return false;//执行后
}
return true;
}
//输入框得到焦点
function onfocusTA(obj){
if(obj.value=="请输入描述信息~!"){
obj.value="";
}
}
//输入框失去焦点
function onblurTA(obj){
if(obj.value==""){
obj.value="请输入描述信息~!";
}
}
//设置提示信息显示方式
function setMsg(name,msg){
var objs=document.getElementById(name+"_msg").innerHTML="<font style='color:red;font-size:12px;'>"+msg+"</font>";
}
</script>
</head>
<body>
<form action="http://localhost:8080" method="POST" onsubmit="return checkFrom()">
<table border="1px" align="center" cellpadding="10px" cellspacing="0px" borderColor="red" bgcolor="pink">
<caption><font color="red" size="6">注册表单</font></caption>
<input type="hidden" name="id" value="9527"/>
<tr>
<td>用户名:</td>
<td>
<input type="text" name="username"/>
<span id="username_msg"></span>
</td>
</tr>
<tr>
<td>密码:</td>
<td>
<input type="password" name="password"/>
<span id="password_msg"></span>
</td>
</tr>
<tr>
<td>确认密码:</td>
<td>
<input type="password" name="password2"/>
<span id="password2_msg"></span>
</td>
</tr>
<tr>
<td>性别:</td>
<td>
<input type="radio" name="gender" value="男"/>男
<input type="radio" name="gender" value="女"/>女
<span id="gender_msg"></span>
</td>
</tr>
<tr>
<td>昵称:</td>
<td>
<input type="text" name="nickname" />
<span id="nickname_msg"></span>
</td>
</tr>
<tr>
<td>邮箱:</td>
<td>
<input type="text" name="email" />
<span id="email_msg"></span>
</td>
</tr>
<tr>
<td>爱好:</td>
<td>
<input type="checkbox" name="like" value="lq"/>篮球
<input type="checkbox" name="like" value="zq"/>足球
<input type="checkbox" name="like" value="qq"/>铅球
<input type="checkbox" name="like" value="blq"/>玻璃球
<span id="like_msg"></span>
</td>
</tr>
<tr>
<td>客户类型:</td>
<td>
<select name="type">
<option value="pm">平民</option>
<option value="sxdy">少先队员</option>
<option value="gqty">共青团员</option>
<option value="ybdy">预备党员</option>
<option value="zsdy">正式党员</option>
</select>
<span id="type_msg"></span>
</td>
</tr>
<tr>
<td>头像:</td>
<td>
<input type="file" name="img" />
<span id="img_msg"></span>
</td>
</tr>
<tr>
<td>描述信息:</td>
<td>
<textarea id="desc" rows="5" cols="45" name="desc" onblur="onblurTA(this)" onfous="onfousTA(this">请输入描述信息~!</textarea>
</td>
</tr>
<tr>
<td>验证码:</td>
<td>
<input type="text" name="valistr" />
<img src="1.jpg" width="100px" height="20px"/>
<span id="valistr_msg"></span>
</td>
</tr>
<tr>
<td colspan="2" align="right">
<input type="submit" value="提 交"/>
<input type="reset" value="重 置"/>
</td>
</tr>
</table>
</form>
</body>
请问这个表单的代码哪里有问题呢,达不到想要的效果,然后我想再完善一下这个表单,让提示信息在tab键后就显示出来,而非提交按钮后显示,应该如何
- 写回答
- 好问题 0 提建议
- 追加酬金
- 关注问题
- 邀请回答
-
1条回答 默认 最新
- qq夜熬 2021-10-08 14:51关注
$(document).ready(function () { document.onkeydown = function (e) { var ev = document.all ? window.event : e; if (ev.keyCode == 9) { checkForm(); } } })
解决 无用评论 打赏 举报
悬赏问题
- ¥200 csgo2的viewmatrix值是否还有别的获取方式
- ¥15 Stable Diffusion,用Ebsynth utility在视频选帧图重绘,第一步报错,蒙版和帧图没法生成,怎么处理啊
- ¥15 请把下列每一行代码完整地读懂并注释出来
- ¥15 pycharm运行main文件,显示没有conda环境
- ¥15 易优eyoucms关于二级栏目调用的问题
- ¥15 寻找公式识别开发,自动识别整页文档、图像公式的软件
- ¥15 为什么eclipse不能再下载了?
- ¥15 编辑cmake lists 明明写了project项目名,但是还是报错怎么回事
- ¥15 关于#计算机视觉#的问题:求一份高质量桥梁多病害数据集
- ¥15 特定网页无法访问,已排除网页问题