HTML5中input的属性解析

快来打我* 2022-05-22 01:09 249阅读 0赞

HTML5中的input标签的属性的属性值有很多，但具体并没有很清楚，现在就这方面的知识进行一下梳理。

*   *  type：该属性是input标签里唯一的必须输入的属性，当然，也可以不填，默认为type = "text"。
     *  required：标记一个字段是否为必须。如果一个字段被标记为required = "required"（严格模式下），或者required（宽松模式下）(ps：下面属性的写法同理，就不一一写出了)，并且这个字段的值为空，或者填入的值是无效值，那么这个表单不能提交。
     *  pattern：该属性包含了一个JavaScript风格的正则表达式，输入的内容必须完全匹配该正则表达式，不然就算输入的内容无效。
     *  min max：这两个属性用于日期date时间time等输入，还有number和range。它们的作用是限制最大值，最小值。
     *  step：和max min类似，作用是提供一个可以上下点的按钮，比如当前数字是1，你设置了step = "5"，点一下上的按钮，就变成6了。
     *  placeholder：该属性是用来提示用户输入的，当用户真的输入了文字之后，会被输入的文字覆盖。
     *  readonly：该属性会让表单空控件不可编辑。这里的不可编辑不是禁用，只是不能编辑文本而已，比如像单选框radio，复选框checkbox这种，本来就是不可编辑的，所以这个属性对它们来说毫无意义。
     *  disabled：该属性会禁用一个表单元素。这里是禁用，完全禁用掉除了<output>之外的所有表单元素
     *  maxlength ：该属性用于限制用户输入的最大字数限制。
     *  size：已经没什么什么实际的作用了，控制大小现在几乎都是由CSS控制了。
     *  form：在HTML5中，表单控件已经没有必要嵌套在一个表单中，新的form属性可以把表单元素与页面上的任意的表单关联起来。也可以被嵌套在一个表单中，随着另一个表单提交。
     *  autocomplete：自动完成用户输入一部分，后面的自动补全。需要浏览器保存用户输入的内容，以便下一次自动补全。
     *  autofocus：该属性指的是表示这个表单控件在页面载入的时候自动获得焦点。

个人水平有限，以上仅供参考，欢迎各位多多交流。