市面上有很多表单验证的框架,教我们怎么验证表单的数据提交,说实话也真的很简单,但是我们会有一种感觉我们要是离开了这些框架的时候,我们有时候会束手无策,然后js验证写的很不规范,没有一套比较好的模式,那我写这篇的目的就是:我们自己构建js验证应该是什么样子的,来慢慢看一下。
假设我们现在写一个登录的页面(这可能是最简单的数据提交了哦),html页面会有一个用户名和一个密码的文本框让我们用户输入自己的用户名和密码,我们肯定是要判断用户名和密码是否为空,很明显这样的js验证判断是放在onblur事件里面触发,html代码如下:
<li>
<label for="email">
用户名:
</label>
<input name="email" type="text" id="email" maxlength="50" onblur="return ValidateHelper.validateStringValueIsEmpty($(this),'通过','不能为空');" /><em></em>
</li>
<li>
<label for="setPwd">
密码:
</label>
<input name="setPwd" type="password" id="setPwd" maxlength="16" onblur="return ValidateHelper.validateStringValueIsEmpty($(this),'通过','不能为空');" /><em></em>
</li>
<label for="email">
用户名:
</label>
<input name="email" type="text" id="email" maxlength="50" onblur="return ValidateHelper.validateStringValueIsEmpty($(this),'通过','不能为空');" /><em></em>
</li>
<li>
<label for="setPwd">
密码:
</label>
<input name="setPwd" type="password" id="setPwd" maxlength="16" onblur="return ValidateHelper.validateStringValueIsEmpty($(this),'通过','不能为空');" /><em></em>
</li>