什么是Form表單?
Form 表單是一組用來收集用戶輸入信息的html 標簽，可以對用戶輸入的信息進行收集 效驗和向服務器提交，從而實現用戶與web 服務器的交互。
Form表單由<form>標簽定義，只有標簽內的組件中的數據才會被提交到服務器。
Form表單的基本組成
表單則由HTMLFormElement類型，此元素繼承了HTMLElement，因此與其他HTML元素具有相同的默認屬性；HTMLFormElement有自己以下屬性和方法；
acceptCharset: 服務器能夠處理的字符集；等價于HTML中的accept-charset特性；
action: 接收請求的URL，等價于HTML中的action
elements: 表單中所有控件的集合.
enctype: 請求的編碼類型；等價于HTML中的enctype特性；
length: 表單中控件的數量；
method： 要發送的http請求類型，一般是get或者是post，等價于HTML中的method；
name: 表單的名稱；
reset(): 將所有表單域重置為默認值；
submit(): 提交表單；會自動將所有具有name屬性的html輸入元素(包括input標簽、button標簽、select標簽等)都將作為鍵值對提交。
target:用于發送請求和接收響應的窗口名稱；
action 簡單的來講 就是請求url的絕對路徑
必需的 action 屬性規定當提交表單時，向何處發送表單數據。
語法
<form action="value">
<input>
輸入標簽，根據type屬性的不同，表現出的功能也不同。
type = text 文本輸入框，單行輸入，用于提交文本。
type = password 密碼輸入框，用于輸入密碼。
type = checkbox 復選框，為瀏覽者提供多選輸入方式。
type = radio 單選框，為瀏覽者提供單選輸入方式。
type = "file" 上傳文件，使瀏覽可以上傳文件到服務器。
type = "hidden" 定義一個隱藏字段，對用戶不可見，可以作為一種隱藏標記來作為辨別上傳數據的真實性的依據。
type = "botton" 定義一個可點擊的按鈕，本身沒有任何行為，可以通過clickon( )屬性來給按鈕添加各種功能。
type = "submit" 提交按鈕，用于向服務器提交表單數據，數據會發送到action屬性中的指定界面。
type = "resist" 重置按鈕，會清除掉表單中的所有數據。
<textarea>
文本域，提供多行文本輸入方式，使瀏覽者能夠輸入大段的文本。
<textarea>value</texarea>
<label>
為input標簽建立一個標注，使用戶更直觀的了解標簽的功能。
同時可以通過for屬性時用戶點擊標注文字時，是焦點轉到和標簽相關的表單控件上。
<label for = "id">標注</label>
<select>
下拉框，通過下拉選項輸入數據。
可以設置selected屬性來設置默認選項。
<select name = "num">
<option value = "1">1</option>
<option value = "2">1</option>
</select>
<button>
提交按鈕標簽，和type="button"屬性相區分，自帶提交功能。
<button>value</button>
Form表單的數據提交方式
表單的數據提交主要由兩個屬性來決定，action和method。
action：規定當提交表單時該向何處發送數據。
通常有3中取值方式：
一個URL，一般指向一個服務器端的程序，程序接受表單傳輸的數據并作處理。
使用mailto協議的地址，會將表單內容以電子郵件的方式發送出去，比較少見需要訪問者計算機上正確安裝和設置了郵件發送程序。
空值，如果action為空或不寫，表示提交給當前頁面。
method：定義瀏覽器將表單中的數據提交給服務器處理程序的方式。
目前最常使用的提交方式為get和post。
get會將表單信息提交服務器時會將信息拼接起來形成一個url地址，容易泄漏，而post不會，所以安全性上post比較有優勢。
get會把提交的內容拼接到地址，所以當提交內容較長時，將無法使用get進行傳輸，而post不會出現這種問題。
所以對與安全性要求比較高的數據傳輸用post，比較低的用get。
一些比較長的數據傳輸用post，短數據用get。
<form id="form">
<div class="form-group col-md-6">
<label>昵稱</label>
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-user"></i></span>
<input type="text" id="nickname" name="nickname" class="form-control" placeholder="昵稱" maxlength="50" value="${obj.nickname!''}">
</div>
</div>
<div class="form-group col-md-6">
<label>手機號</label>
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-phone"></i></span>
<input type="phone" id="phone" name="phone" class="form-control" placeholder="手機號" maxlength="11" value="${obj.phone!''}" >
</div>
</div>
</form>
- 序列化表單
var data = $('#form').serialize();
$.post("${basePath}/self/editUser.do",data,function(data){
}):
- jquary賦值 屬性賦值
給標簽id為faceimg 的src屬性賦值
$('#faceImg').attr("src",data.path);
$('#face').val(data.path);
- 以下兩種寫法可以達成一致的目的
$('#fileForm').attr('action','${basePath}/upload/img.html');
<form id="fileForm" method="post" enctype="multipart/form-data"
target="fileFrame" action="${basePath}/upload/img.html">
</form
