为什么 HTML 表单中的某些标签会获得 name 属性而其他标签会获得 value 属性？答案

【问题标题】：Why would some tags in an HTML form get a name attribute and others get a value attribute?为什么 HTML 表单中的某些标签会获得 name 属性而其他标签会获得 value 属性？
【发布时间】：2016-04-08 17:44:06
【问题描述】：

我正在学习如何编写 HTML 表单，我对我遇到的示例几乎没有疑问。

通俗地说值和名称有什么区别？
为什么前两个标签输入中的值保留为空字符串？
为什么第三个标签的select被赋予了名称而不是值，而以下3个选项仅被赋予了值？
第5个label输入的value后面有个S属性，是什么意思？
为什么第 6 个标签的输入既有名称又有值？
为什么第6个输入的名字是“facilities[]”，这和数组有关系吗？
再次，为什么第 8 个标签的输入有名称和值，但它的按钮有类和名称？

我真的需要针对每个标签的具体答案，因为我还是 Web 开发的初学者。

这是我的代码：

<form id="registration_form" method="POST">


  <!-- 1st-->
  <label>Full name*:</label>
  <br>
  <input type="text" name="full_name" placeholder="FirstName LastName" autofocus="autofocus" value="">
  <br>


  <!-- 2nd-->
  <label>Email address*:</label>
  <br>
  <!-- value leaves input box empty-->
  <input type="text" name="email_addr" value="" placeholder="jamesruss@example.com">
  <br>



  <!-- 3rd-->
  <label>Select Tour Package* :</label>
  <br>
  <select name="package">
    <option value="Goa">Goa</option>
    <option value="Kashmir">Kashmir</option>
    <option value="Rajasthan">Rajasthan</option>
  </select>
  <br>

  <!-- 4th-->
  <label>Arrival date*:</label>
  <br>
  <input type="text" name="arv_dt" placeholder="m/d/y" value="">
  <br>


  <!--5th -->
  <label>Number of persons*:</label>
  <br>
  <input type="text" name="persons" value="" s>
  <br>



  <!-- 6th-->
  <label>What would you want to avail?*</label>
  <br>Boarding
  <input type="checkbox" name="facilities[]" value="boarding">
  <br>Fooding
  <input type="checkbox" name="facilities[]" value="fooding">
  <br>Sight seeing
  <input type="checkbox" name="facilities[]" value="sightseeing">
  <br>



  <!-- 7th-->
  <label>Discout Coupon code:</label>
  <br>
  <input type="text" name="dis_code" value="">
  <br>



  <!-- 8th-->
  <label>Terms and conditions*</label>
  <br>
  <input type="radio" name="tnc" value="agree" checked>I agree
  <input type="radio" name="tnc" value="disagree">I disagree
  <br>
  <button type="submit" class="btn btn-large btn-primary" name="submit">Complete reservation</button>



</form>

【问题讨论】：

标签： html attributes name-attribute

【解决方案1】：

name 属性是元素的名称。例如，服务器可以使用它来识别表单提交中的字段。在像facilities[] 这样的情况下，当服务器接收到所有具有该名称的输入值时，它会将所有输入值放入一个数组中。

value 属性是一个默认值，将在页面加载时显示在元素中。此值也将发布到服务器并关联回名称。

类通常只用于 CSS 属性或 JavaScript，与您问题中的其他任何内容都没有真正的关系。

对于您的情况，S 属性可能没有任何意义，只是一个错字。如果您使用Angular's directives之类的东西，它可能会有一些意义

【讨论】：

【解决方案2】：

所以name="" 是元素的标识符，而value="" 是回发期间该元素的返回值。

例如 - 你的文字输入：

<input type="text" name="email_addr" value="" placeholder="jamesruss@example.com">

有一个默认值 null - 因此如果您要使用此值提交表单，名称为“email_addr”的元素将具有值null。如果您输入 example@email.com - 该元素的值将是 `example@email.com。

选择元素具有值的原因是因为当您进行选择时 - <option value="testValue" >THIS DOESNT MATTER</options> - 您告诉您的应用程序您要将值存储为 testValue。选项标签中定义的文本就是屏幕上显示的内容。

【讨论】：

【解决方案3】：

value 是提交表单后将返回的内容。 name 只是字段的名称，被服务器端语言（如PHP 和.NET）用来定位输入以接收值。
没有意义。您可以根据需要设置默认值，但将其留空没有任何意义 - 这与在代码中未定义 value 属性相同。
<select> 元素及其子元素的标准语法。
s 可能是一个错字。如果没有更多上下文，我们无法确定。

5-6。请参阅eh. 的回答 - 他有一个可靠的解释。

可以为按钮赋予name 属性，因此在服务器端，您可以确定单击了哪个按钮。在这种情况下，这些类专门用于使用Bootstrap 进行样式设置。

【讨论】：

【解决方案4】：

1) 名称是计算机用来指代该项目的名称，而值是指输入的任何答案。您没有询问占位符，但许多浏览器会在屏幕上显示它，就好像它是输入的一样（可能变暗) 但它永远不会成为真正的价值。

2) 让我把它翻过来……如果 Value 以非空白开头，则用户实际上不需要输入任何内容。他们可以将其用作默认值。姓名和电子邮件地址不太可能是可接受的默认答案。

3) 第三个项目是一个列表框，而不是像前两个那样的文本框。尽管您可以设置默认值，但浏览器可能会选择第一个作为默认值，而无需指定。

4) 我不熟悉“s”属性。我怀疑这是一个错字。

5 & 6) 这些复选框共享一个名称，因此它们被组合在一起。每个单独的复选框都有一个值，但是当编程语言使用该值时，它最终会看起来像一个数组，其中包括所有“已检查”的答案。

7) 类与视觉风格相关（谷歌“级联样式表”），与名称/值/等无关。我们一直在探索。按钮也可以有一个值，但除非您将控件组合在一起（如问题 5 和 6 中的复选框），否则这很少有用。

我希望这会有所帮助！

【讨论】：