发表于: 2019-10-07 22:37:08

1 930


今天完成的事:

Artucle列表页面的布局。脚本还没有写。

明天计划的事:

完成Artucle列表页面的布局,

遇到的问题:

暂无

收获:

常见的验证表单方式

输入时进行实时验证(.onchange)

退出焦点时验证(.onblur)

提交表单时进行本地验证

H5自带的表单验证属性

1.输入时进行实时验证

<form name="a">
      <input type="text" name="b" placeholder="不超过5个字符" onkeydown="keydown()">
</form>

2.离开(失去)焦点时验证

<form name="c">
     <input type="text" name="d" placeholder="不超过5个字符" onblur="onBlur()">
 </form>

3.是否填写以及长度限制

<form name="e" onsubmit="return test()">
    <input type="text" name="f" placeholder="不超过5个字符">
  <br>
    <input type="submit" name="Submit" value="提交">
  <br>
</form>

表单验证的作用

用户是否已填写表单中的必填项目?

 用户输入的邮件地址是否合法? 

用户是否已输入合法的日期? 

用户是否在数据域(numeric field) 中输入了文本?  

如何使用表单验证 利用手工js代码 if/switch,或者正则表达式,+DOM操作 

缺点:代码量大,耗时多 优点:相比于第三方库,可以减少加载的js文件大小,样式灵活 

如果网站的表但很少,或者格式简单,或者对性能的要求高,可以手工写 

 利用js第三方插件 优点:全站适用,手工代码量少 缺点:有可能加重服务器负担,样式相对固定       


返回列表 返回列表
评论

    分享到