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

Question

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

1. 通俗地说，value 和 name 有什么区别？

2. 为什么前两个标签输入的值是空字符串？

3. 为什么第三个label的select只取名不取值，而后面​​3个option只取值？

4. 第5个label input value后面有一个S属性，是什么意思？

5. 为什么第 6 个标签的输入既有名称又有值？

6. 为什么第6个输入的名称是“facilities[]”，这和数组有关系吗？

7. 同样，为什么第 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>

Answer 1

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

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

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

对于您的案例中的 S 属性，它可能没有任何意义，只是一个拼写错误。如果你使用类似 Angular's directives 的东西，它可能有一些意义