> 文档中心 > 一篇拿下<input>元素

一篇拿下<input>元素


博主有话说:如果有描述错误之处请大家纠正。让我们可以一起学习一起进步。

个人主页:GUIDM主页

内容专栏:干货

此块内容为纯纯的干货,略显乏味枯燥,是笔记向的blog。如果觉得还不错,希望你可以一键三连,一整个大感谢。

 input必须得给它拿捏得死死的。

Input元素用于搜集用户信息,它的属性真的非常之多,笔记都写了好几页。在get元素之前,先来为

  • 此标签为input元素定义标记,label元素不会向用户呈现任何特殊效果,当用户选择此便签时,浏览器会自动将焦点转到标签相关的表单控件上。
  • label标签的for属性应当与相关元素的id属性相同

属性:

(1)for属性:规定label与哪个表单元素绑定。

  •  显式形式:
  •  隐式形式:将表单控件为标记标签的内容。

(2)form属性:规定label所属的一个或多个表单。

form属性值必须是其所属的表单的id,若引用一个以上的表单,请使用空格分隔的列表。

        ……

你们的魔鬼来咯。321

元素的属性

1、accept属性 (只能与配合使用)

该属性规定能够通过文件上传进行提交的文件类型。(避免使用此属性,应该在服务器端验证文件上传。)

 16、max/min属性

该属性规定输入字段所允许的最大值/最小值,配合使用可创建取值范围。

属性值 描述
number 数字值。
date 日期。

17、maxlength属性(与或配合使用)

该属性规定输入字段的最大值及字符个数计。

 

18、multiple属性 (适用于和)

该属性规定输入字段可选择多个值。

 

19、name属性:

该属性规定input元素的名称,用于对提交服务器后的表单数据进行标识,只有设置了name属性的表单元素才能在提交表单时传递它们的值。

20、pattern属性:

该属性规定用于验证输入字段的模式(正则表达式)。

21、placeholder属性:

该属性提供可描述字段预期值的提示信息,该提示会在输入字段为空时显示,输入信息后则会消失。

 

22、readonly属性(适用于和)

该属性规定输入字段为只读,只读字段不能修改。

用户可以使用tab键切换到该字段,还可以选中或拷贝文本。

23、required属性:

该属性必需在提交之前填写输入字段,若使用该属性,则字段是必填(或必须)的。

24、size属性:

该属性定义输入字段的宽度。

对于和size属性定义可见的字符数,而对于其他类型,size属性定义的是以像素为单位的输入字段宽度。

在这里推荐使用CSS来代替:

25、src属性(只能与配合并同时使用)

该属性规定作为提交按钮显示的图像的URL。

属性值 描述
post 以HTTP post事务的形式发生表单数据。
get 以URL追加表单数据: URL?name=value&name=value

26、step属性:

规定输入字段的合法数字间隔,可以与max以及min属性配合使用。

27、type属性

属性值 描述
button 定义可点击按钮

checkbox

定义复选框
file 定义输入字段和浏览按钮,供文件上传
hidden 定义隐藏的输入字段
image 定义图像形式的提交按钮
password 定义图像形式的提交按钮
radio 定义密码字段,该字段中的字符被掩码
reset 定义单选按钮
submit 定义重置按钮
text 定义单行的输入字段,用户可以其中输入文本,默认20个字符

28、value属性:

为input元素设定值。

  • type=“bottom”,“reset”,“submit”——定义按钮上的显示文本。
  • type=“text”,“password”,“hidden”——定义输入字段的初始值。
  • type=“checkbox”,“radio”,“image”——定义与输入相关联的值。
  • 无法与type=“file”一同使用。

植物大战僵尸