浅谈input中的name,value以及label中的for


本文摘自PHP中文网,作者青灯夜游,侵删。

本文给大家浅谈一下input中的name,value以及label中的for,有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助。

input具有很多属性,比较常用的有type,value,name,placeholder,multiple,checked等。对于其中的name、value、label相关以及标签外的文字,我一直是懵懵懂懂,今天总算弄了个清楚。

1)name属性 

  定义:name 属性规定 input 元素的名称。

  用法:name 属性用于对提交到服务器后的表单数据进行标识,或者在客户端通过 JavaScript 引用表单数据。

  注释:只有设置了 name 属性的表单元素才能在提交表单时传递它们的值。

也就是说,name对于页面显示是没啥用的(加不加都不影响页面显示),而是用于和服务器交互或者编写js时方便引用。

2)value属性

定义:value 属性为 input 元素设定值。

用法:对于不同的输入类型,value 属性的用法也不同:

  • type="button", "reset", "submit" - 定义按钮上的显示的文本

1

<input type="button" value="按钮">按钮文字

1.jpg

  • type="text", "password", "hidden" - 定义输入字段的初始值

1

<input type="text" value="初始文本">标签外

2.jpg

  • type="checkbox", "radio", "image" - 定义与输入相关联的值

1

<input type="radio" value="按钮">按钮文字

3.jpg

注意:此时显示在页面上的是“按钮文字”(标签外的文字),而此时的value的作用主要是用于js中的交互操作,所以此时的value一般设置为与输入相关的值。例如:

1

<input type="radio" value="male">男

注释:<input type="checkbox"> 和 <input type="radio"> 中必须设置 value 属性。

3)label

<label> 标签为 input 元素定义标注(标记)。例如:

阅读剩余部分

相关阅读 >>

如何使用css对td中input的宽度设置

html5 input输入实时检测以及延时优化

html中input标签的属性有哪些

html中的name属性的有哪些作用?默认的name属性又是什么?

实例分析input 、submit、button和回车键提交数据区别

怎样通过disabled和readonly将input设置为只读效果

javascript中for in语句怎么用

javascript如何获取修改value

谷歌浏览的label与input间距问题应该如何解决

html里的name与id和class到底有什么不同

更多相关阅读请进入《input》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...