HTML表单name属性怎么用_HTML表单元素name属性的作用与设置方法

新闻中心 NEWS CENTER

您当前位置：首页 > 新闻中心 > 网络学院

HTML表单name属性怎么用_HTML表单元素name属性的作用与设置方法

2025-11-20

浏览次数：次

返回列表

name属性是表单数据提交的关键标识，服务器通过其对应的值接收数据，如username=admin&password=123；它用于定义表单控件名称，支持J*aScript操作元素，并使单选按钮和复选框按组工作；每个可提交的表单元素都需设置name属性，且应语义清晰、避免特殊字符；无name属性的元素不会被提交。

html表单name属性怎么用_html表单元素name属性的作用与设置方法

HTML表单中的 name 属性 是一个非常关键的设置，它决定了表单数据在提交时如何被识别和处理。没有正确设置 name 属性，服务器端就无法获取对应的数据。

name 属性的作用

name 属性 主要用于标识表单控件，在表单提交时，浏览器会将控件的 name 和 value 组合成键值对发送给服务器。例如：username=admin&password=123 中的 "username" 和 "password" 就是 name 属性的值。

主要作用包括：

作为服务器端接收数据的字段名
在 J*aScript 中通过 name 获取或操作表单元素
为单选按钮、复选框等分组提供依据（相同 name 的单选按钮互斥）

常见表单元素的 name 设置方法

每个需要提交数据的表单控件都应设置 name 属性。以下是常见用法示例：

Kreado AI

Kreado AI是一个多语言AI视频创作平台，只需输入文本或关键词，即可创作真实/虚拟人物的多语言口播视频。为创作者提供AI赋能

182 查看详情 Kreado AI

<form action="/submit" method="post">
<!-- 文本输入框 -->
<input type="text" name="username" placeholder="请输入用户名"></p><p><!-- 密码框 -->
<input type="password" name="password"></p><p><!-- 单选按钮：同组使用相同 name -->
<input type="radio" name="gender" value="male"> 男
<input type="radio" name="gender" value="female"> 女</p><p><!-- 复选框 -->
<input type="checkbox" name="hobby" value="reading"> 阅读
<input type="checkbox" name="hobby" value="music"> 音乐</p><p><!-- 下拉选择框 -->
<select name="city">
<option value="beijing">北京</option>
<option value="shanghai">上海</option>
</select></p><p><!-- 提交按钮 -->
<input type="submit" value="提交">
</form></p>