问题：

表单怎么在输入后立即验证，而不是提交后再验证那么不方便（网上搜到的要么是模棱两可，要么是残缺不全…）

方法：

鉴于此，小可，水山奇，将其代码补全，加上小可我个人的理解（注释）在上面，仅供后来者少走弯路，也请各路好汉批评指正…（转发请注作者,xiexie）————table表格版，以后会继续有JQuery版…

如果帮助到您，顶一下ヾ(≧O≦)〃嗷~

截图：

表单及时验证小例子用户名:用户名由6-18位字符组成

<tr>
<td>密码:</td>
<td></td>
<td id="checktext2">* 密码由6-18位字符组成，且必须包含字母、数字和标点符号</td>
</tr>

<tr>
<td>确认密码：</td>
<td></td>
<td id="checktext3">* 请再次输入你的密码</td>
</tr>

<tr>
<td>用户类型：</td>
<td>
<select id="selUser" onblur="checkut()">
<option name="selUser" value="0">请选择
<option name="selUser" value="1">管理员
<option name="selUser" value="2">普通用户

用户类型<tr>
<td>性别：</td>
<td>
<input type="radio" value="1" name="sex" onchange="checkGender()"/>男
<input type="radio" value="2" name="sex" onchange="checkGender()"/>女
</td>
<td id="checktext5">* 请选择你的性别</td>
</tr>

<tr>
<td>出生日期：</td>
<td><input type="date" name="date" id="txtDate" onblur="checkDate()"/></td>
<td id="checktext6">* 请选择你的出生日期</td>
</tr>

<tr>
<td>兴趣爱好：</td>
<td>
<input type="checkBox" name="hobby" value="reading" onchange="checkHobby()">阅读
<input type="checkBox" name="hobby" value="music" onchange="checkHobby()">音乐
<input type="checkBox" name="hobby" value="sports" onchange="checkHobby()">运动
</td>
<td id="checktext7">* 请选择你的兴趣爱好</td>
</tr>

<tr>
<td>电子邮件：</td>
<td><input type="text" name="email" id="email" onchange="checkemail()"/></td>
<td id="checktext8">* 请填写常用的EMAIL，将用于密码找回</td>
</tr>

<tr>
<td>自我介绍：</td>
<td><textarea cols="30" rows="3" name="introduction" id="introduction" onchange="checkintro()">这是自我介绍...</td>
<td id="checktext9">* 限100字内</td>
</tr>

CSS样式：

textarea{
width:230px;
height:50px;
}

body
{
font-size:15px;
/ 字体的样式 /
font-family:Microsoft YaHei;
}

select option{
font-size:10px;
font-family:Microsoft YaHei;
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。

原文链接：https://www.f2er.com/js/45879.html

js表单及时验证 js表单立即验证 js表单验证