如何取得HTML中input標籤的value的值？關於input value的用法詳解

本篇文章主要為大家講述的是關於HTML input標籤的value屬性的用法和value屬性的值，還有關於input標籤的value屬性的相關聯的值。下面就讓我們一起來看看這篇文章吧

首先讓我們來看看HTML中的input標籤的用法：

value屬性是input元素規定值。

對於不同類型的input元素，value屬性的用法也不同：

對於"button","re​​set","submit"類型-定義按鈕上的文字

對於"text","password","hidden"類型-定義輸入字段的初始（預設）值

#對於"checkbox", "radio", "image" 類型-定義與input元素相關的值。該值會傳送到表單的action URL。

註解：value屬性對於和是必要的。

註解：value屬性不適用於。

說了這麼多，來看看實例：

有value屬性預定義值的表單：

<form action="demo_form.asp" method="get">
  请输入用户名: <input type="text" name="fname" value="Bill" /><br />
  第二次用户名: <input type="text" name="lname" value="Gates" /><br />
  <input type="submit" value="提交" />
</form>

效果如圖所示：

上圖就是程式碼的結果，是定義的表單形式。

現在讓我們來看看相關聯的value值：

以輸入框為例，每個框是否可以輸入內容？這個內容就是輸入框關聯的值，你給它設定個value屬性，那麼你設定的value就是它的值，就會顯示在輸入框中。同樣的，單選按鈕也可以設定一個值，但是這個值不像輸入框那樣你設定了會顯示出來，但是設定了就代表它就有了這麼一個值，就好比標註它是男是女一樣，是男是女未必看的出來，但是可以標示出來。

有時需要把一個input標籤從一個位置調整到另一個位置，調整後input的值就是input標籤中value屬性的值，如果你修改值的方式並沒有修改到value屬性，那麼調整後你設定的值就會遺失。 

<form>
<input id="input" type="input" value=&#39;2&#39;></input>
</form>

所以假如你有上述的操作，請一定確保你修改值的方式修改到了input的value屬性，或者使用其他方式實現上述的操作，如jQuery的clone方法。

再來一個關於input標籤的複選框做法：

<form action="demo-form.php">
  <input type="checkbox" name="vehicle[]" value="Bike">我会PHP<br>
  <input type="checkbox" name="vehicle[]" value="Car">我会html<br>
  <input type="checkbox" name="vehicle[]" value="Boat">我会python<br>
  <input type="submit" value="提交">
</form>

上程式碼效果如圖：

好了，現在這篇文章結束了，有問題的小夥伴就在下方留言吧

【小編推薦】

##HTML中的base標籤如何寫相對路徑？ （內附使用介紹）

HTML img標籤的src屬性的用法是什麼？具體使用方法解析（內附實例）

以上是如何取得HTML中input標籤的value的值？關於input value的用法詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！