前端表單交互

應用場景 登錄、注冊 、舉報投訴、發(fā)表意見建議

input表單type屬性值（常用的8種）

HTML4
type = "text" 單行文本輸入
type = "password" 密碼 （maxlength=""）
type = "radio" 單項選擇 （checked="checked"）
type = "checkbox "多項選擇"
type = "button" 按鈕
type = "submit" 提交
type = "file" 上傳文件
type = "reset" 重置

HTML5智能表單
type = "email" 限制用戶輸入必須為Email類型
type = "url" 限制用戶輸入必須為url類型
type = "date" 限制用戶輸入必須為日期類型
type = "datetime" 顯示完整日期含時區(qū)
type ="date-local" 顯示完整日期不含時區(qū)
type = 'time" 限制用戶輸入必須為時間類型
type = "month" 限制用戶輸入必須為月類型
type = "week" 限制用戶輸入必須為周類型
type = "number" 限制用戶輸入必須為數(shù)字類型
type ="range" 生成一個滑動條
type = "search"具有搜索意義的表單 results = "n"屬性
type = "color" 生成一個顏色選擇表單
type = "tel" 顯示電話號碼

HTML5新增表單屬性
require 內(nèi)容不能為空
placeholder 表單提示信息
autofocus 自動聚焦
pattern 正則表達式 輸入的內(nèi)容必須匹配到指定正則范圍
autocomplete 是否自動保存用戶輸入值 默認為on
formaction 在submit里定義提交地址
datalist 輸入框選擇列表配合list使用 list值為datalist的id值
output 計算或腳本輸出

form標簽五大屬性 action method target name enctype(編碼方式）
label標簽為input標簽定義標注 for屬性指向關(guān)聯(lián)的input的id屬性
radio在一起 要求name值必須一樣 才是一組單選按鈕 并且必須加value值才能被后臺獲取
checkbox也必須要求name值一樣 選擇多個 后臺通過
if(is_array($_GET["food"]) && !empty($_GET["food"])){
foreach($_GET["food"] as $value){ //循環(huán)獲取數(shù)組里面的值然后輸出
echo $value
}
}
判斷是否為數(shù)組 并且不為空

按鈕標簽常用來觸發(fā)js代碼
<button></button>默認是提交按鈕 <button type="submit"></button>
以上兩個button 如果在form表單里面用input
如果在非form表單里面用<button></button>
file 上傳文件 multiple 上傳多個文件
hidden 隱藏 后臺用來監(jiān)控點擊按鈕點了多少次 點擊圖片點了多少次
后臺通過input的name屬性獲取數(shù)據(jù)$_GET["username"]