HTML中input标签maxlength属性的妙处
HTML中的input标签可是很常用的。
HTML本身也非常简单,就是若干标签,每个标签有若干属性。
我在学习HTML的过程中,也没有太过重视。
今年,在写前端表单验证的时候,发现maxlength这个属性很好用。
实际需求
前端的表单,需要进行验证。
结合JS表单验证框架,写了很多前端验证的代码。
其中,有这么一个需求:用户最多只能输入10个字符。
按照惯性,肯定是会去写JS表单验证了。
实际上,根本没有必要。
HTML中的maxlength属性就可以很简单地解决这个问题。
<input type="text" size="10" maxlength="10" />
通过这个很简单的属性设置,用户能够输入的字符就是10。前端,根本不需要再去验证。
观点结论
这个属性很简单,但是可以节省不少时间。
这个实际案例提醒我们,不要被自己的习惯误导了。
很多问题存在着简单的解决方法,不要把简单的问题用复杂的方法解决了。
切记!
原文链接:http://blog.fansunion.cn/articles/3509(小雷博客-blog.fansunion.cn)
HTML中input标签maxlength属性的妙处的更多相关文章
- html <input>标签类型属性type(file、text、radio、hidden等)详细介绍
html <input>标签类型属性type(file.text.radio.hidden等)详细介绍 转载请注明:文章转载自:[169IT-最新最全的IT资讯] html <inp ...
- Spring中bean标签的属性和值:
Spring中bean标签的属性和值: <bean name="user" class="com.pojo.User" init-method=" ...
- 关于django中input标签中file类型以及开路由
0825自我总结 关于django中input标签中file类型 1.input提交图片实时展示 <img src="/static/img/default.png" wid ...
- Html中input标签的使用
1.取消按钮按下时的虚线框 在input里添加属性值 hideFocus 或者 HideFocus=true 2.只读文本框内容 在input里添加属性值 readonly 3.防止退后清空的TEXT ...
- 解决input标签placeholder属性浏览器兼容性问题的一种方法
为文本框input添加文字输入提示,H5为input提供了一个placeholder属性.在支持H5的浏览器中,用此属性设置输入提示,简单方便,但是对于IE8以下版本,都不支持placeholder属 ...
- 关于input标签checkbox属性 和checked
我们设置了type的属性为checkbox时,记住以下3个关键点 1.点勾选时或者说点击时,checked为选中,在input标签中是checked=“checked”,注意这里面无论checked= ...
- html5中 input的pattern属性 和 details/summary元素
html5--3.21 课程小结与其他新增元素 一.总结 一句话总结: input的pattern属性可以设置正则验证,比如检测学号的位数和数字区间 details/summary元素配合起来可以做元 ...
- html中各种标签和属性(最基础的基本都有)
1.标题标签: h1~h6 ctrl+1~6 2.段落标签: p ctrl+shift+p 3.换行标签: br shift+回车 4.水平线: hr 5.加粗标签: stro ...
- 前端 html input标签 placeholder属性 标签上显示内容
前端 html input标签 的placeholder属性 标签上显示内容 <!DOCTYPE html> <html lang="en"> < ...
随机推荐
- JS模式
策略 命令 迭代器 代理 组合 发布/订阅 单例 享元 职责链 中介者 装饰者 状态 适配器 设计原则: 单一职责.最少知识.开放-封闭
- WebAssembly学习(六):AssemblyScript - 限制与类型
一.限制 将无类型的JavaScript编译为WebAssembly没有意义,因为它最终会导致运行其中较慢的一个JavaScript. 相反,AssemblyScript专注于WebAssembly擅 ...
- 洛谷 P1719 最大加权矩形
P1719 最大加权矩形 题目描述 为了更好的备战NOIP2013,电脑组的几个女孩子LYQ,ZSC,ZHQ认为,我们不光需要机房,我们还需要运动,于是就决定找校长申请一块电脑组的课余运动场地,听说她 ...
- js关于循环的理解
学习任何语言都离不开循环,js也是一样,看了网上的资料,整理一份关于js循环的理解. 1.最基础循环,js和其他高级语言一样使用for.while循环 (function() { for(var i= ...
- java为什么要定义接口等相关解释
1.接口的作用是实现多重继承 因为只能继承一个类(规定的) 2.一个类只能继承一个父类,但是可以实现一个或多个接口 3.abstract关键词能让你在类里创建一个或多个没有定义的方法—你给出接口,但 ...
- Kinect 开发 —— 常见手势识别(上)
悬浮按钮 (Hover Button) 悬浮按钮通过将鼠标点击换成悬浮然后等待(hover-and-wait)动作,解决了不小心点击的问题.当光标位于按钮之上时,意味着用户通过将光标悬浮在按钮上一段时 ...
- JS面向对象:
面向对象:--JS系统对象也是基于原型的程序--不要修改或者添加系统对象下面的方法和属性eg: var arr = [1,2,3]; Array.prototype.push = function() ...
- cat---查看文件内容
- Java基础学习总结(21)——常用正则表达式列表
很多不太懂正则的朋友,在遇到需要用正则校验数据时,往往是在网上去找很久,结果找来的还是不很符合要求.所以我最近把开发中常用的一些正则表达式整理了一下,包括校验数字.字符.一些特殊的需求等等.给自己留个 ...
- HDU——T 4738 Caocao's Bridges
http://acm.hdu.edu.cn/showproblem.php?pid=4738 Time Limit: 2000/1000 MS (Java/Others) Memory Limi ...