登录  /  注册

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

寻∝梦
发布: 2018-08-27 14:16:28
原创
28197人浏览过

本篇文章主要介绍了html中表单的name属性介绍,有基础的定义和实例效果图,还有html中的name属性的作用解释,还有表单中的name属性的实例介绍。

我们先来了解一下name属性在表单中的定义:

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

name 属性用于对提交到服务器后的表单数据进行标识

或者在客户端通过 JavaScript 引用表单数据。

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

<input name="value">
登录后复制

看一个实例,让你们更了解上面的定义

带有两个文本字段和一个提交按钮的 HTML 表单:

<form action="form_action.asp" method="get">
  <p>name: <input type="text" name="fullname" /></p>
  <p>email: <input type="text" name="email" /></p>
  <input type="submit" value="Submit" />
</form>
登录后复制

代码的效果是什么呢?看图

tuyi.png

说了这么多,大家对name属性应该有些了解了,那么现在开始说说HTML中name属性的作用

在表单提交时如果你用request.form("name")那么你可以得到你文本框中输入的值,如果你页面上有多个控件的name都相同的话,那你用getelementsbyname就可以得到一个数组。还有如果你页面上有两个radio是让用户来选择性别的话,如果你没给这两个按钮设置name属性,那么你可以试试它是个什么效果。radio是能用来让用户选择性别的,一般选择性别时只能选一个,如果你不把这两个radio的name不设成相同的话,那么他就会既能选择男又可以选择女,所以name属性在表单中是很重要的.

说了这么多,再看一个name属性的作用实例代码:

<html> 
<select> 
<option value="1">php中文网</option> 
<option value="2" selected="selected">百度</option> 
<option value="3">腾讯</option> 
</select> 
<form> 
<input type="checkbox" name="newsletter" checked="checked" value="Daily" />非常喜欢 
<input type="checkbox" name="newsletter" value="Weekly" />喜欢 
<input type="checkbox" name="newsletter" checked="checked" value="Monthly" />还行 
</form> 
<input type="button" value="确定"/> 
<SPAN style="WHITE-SPACE: pre"> <input type="text" value="请输入原因"/> </SPAN> 
</html>
登录后复制

这个图的效果是什么呢,让我们一起来看看

tuer.png

name属性是控件的名称(多个控件可以取同一个名称),value是控件的值

并不是所有控件的value都会显示出来

定义控件的name和value之后就可以在服务器上获取这个控件和它的值

没看到submit的name,并不表示浏览器忽略了它的name,在提交之前它也被浏览器定义了name,在服务器上一样可以得到它的name 和value

控件不定义name/value也可以显示,只是为了方便在服务器接收和区别,才定义它的name/value,当然按钮的value 不光是存放它的值,也是用来显示的

好了,以上就是这篇文章的全部内容了,有什么疑问欢迎在下方提问

【相关推荐】

HTML中head标签是什么意思?一篇文章教你正确地使用head标签

html表格中的th表头内容怎么居中?th表头标签align属性的具体介绍

以上就是HTML中的name属性的有哪些作用?默认的name属性又是什么?的详细内容,更多请关注php中文网其它相关文章!

智能AI问答
PHP中文网智能助手能迅速回答你的编程问题,提供实时的代码和解决方案,帮助你解决各种难题。不仅如此,它还能提供编程资源和学习指导,帮助你快速提升编程技能。无论你是初学者还是专业人士,AI智能助手都能成为你的可靠助手,助力你在编程领域取得更大的成就。
相关标签:
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
关于CSS思维导图的课件在哪? 课件
凡人来自于2024-04-16 10:10:18
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2024 //m.sbmmt.com/ All Rights Reserved | php.cn | 湘ICP备2023035733号