form表單詳解


form表單

form是一個復雜的系統標簽,其內部又可包含很多的一些輸入標簽

例如input 輸入文本標簽  checkbox 多選標簽等等

form表單有幾個屬性我們需要注意一下

  1:action屬性,里面寫的是url鏈接,接就是表單提交的地址

  2:method屬性,里面寫的是數據提交的方式,可以寫入get或者post

  3:enctype屬性,提交數據的編碼格式

form表單中的標簽的前后台交互

form表單被我們應用在前后台交互的環節的,里面的值可以在后台通過某些key取出來

下面就來講解不同標簽取值的方法

1. input 標簽
input標簽我們最為常見,里面有三個屬性比較重要
  a. type 他是代表input的類型
  b. name 他就是后台取值的依據(key)
  c. val 他是我們輸入的值,也是后台需要的值
  <input type="" name="">

然后我們根據type的類型,又可以把input進行細分

  a. text 表示普通的文本,明文輸入
  b. password 輸入的也是文本,密文輸入
  c. number 輸入的是數字,不是數字不讓輸入
  d. submit 提交按鈕,提交form表單的內容
  e. button 普通的按鈕
  f. radio 單選框,我們需要注意的是單選框的所有的name值必須相同
      如果name不相同,就說明不在同一個選擇方位,也就不存在單選,然后想要在后台取到他的值,

      你必須在定義的時候給附上一個值給value,這樣才能取到值
  g. checkbox 復選框,內容和單選框一樣
  h. file 選擇文件,可以選擇文件提交給后台

以上基本是input的所有類型,需要注意幾個點
  1.取值都是通過name進行取值,所以必須給name賦值
  2.文本類型想要附上初始值,直接在value中加入值就可以
  3.選擇框如果想要默認選中誰,那就在誰的標簽中加入checked屬性

2. select 標簽
select標簽是一個下拉框的形式讓用戶進行選擇選項
所以select標簽中必須包含option標簽才能顯示屬性
形式為:
<select>
<option></option>
<option></option>
</select>

然后select中有全局屬性name,這個name是后台又來進行取值的
每個option標簽的文本內容是顯示給用戶看的,我們需要取的是option標簽中的value屬性,所以在開始必須給option的value賦值
后台通過select的name取值,直接取到的就是對應option的value

如果我們向讓他默認選擇某個option,可以在option標簽中加入selected屬性,如果都不加,默認是顯示第一個

3. button 按鈕標簽
新出的標簽,與input中type為button的按鈕一樣

4. textarea 文本框標簽

與input中的text一樣都是輸入文本的,但是textarea標簽沒有字數的限制,並且輸入框可以拖拉。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM