怎么獲取HTML中input標簽的value的值

今天就跟大家聊聊有關怎么獲取HTML中input標簽的value的值，可能很多人都不太了解，為了讓大家更加了解，小編給大家總結了以下內容，希望大家根據這篇文章可以有所收獲。

創新互聯建站專注于企業全網營銷推廣、網站重做改版、文圣網站定制設計、自適應品牌網站建設、html5、商城系統網站開發、集團公司官網建設、外貿網站建設、高端網站制作、響應式網頁設計等建站業務，價格優惠性價比高，為文圣等各大城市提供網站開發制作服務。

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

value屬性是input元素規定值。

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

對于"button","reset","submit"類型-定義按鈕上的文本

對于"text","password","hidden"類型-定義輸入字段的初始（默認）值

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

注釋：value屬性對于<input type="checkbox">和<input type="radio">是必需的。

注釋：value屬性不適用于<input type="file">。

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

帶有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>

效果如圖所示：

怎么獲取HTML中input標簽的value的值

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

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

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

有時需要把一個input標簽從一個位置調整到另一個位置，調整后input的值就是input標簽中value屬性的值，如果你修改值的方式并沒有修改到value屬性，那么調整后你設置的值就會丟失。

<form> 
<input id="input" type="input" value='2'></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中input標簽的value的值