深入理解HTML5之表單元素屬性

表單是頁面上非常重要的一項內容,用戶可以輸入的大部分內容都是在表單的元素中完成的,客戶端與服務端的交互在大多數情況下也是通過表單中點按鈕來完成的。

1.form
<form action="/add" method="get" id="textform">       
<input type="text" name="" id="">    
</form>    
<textarea form="textform"></textarea>

form 屬性規定輸入域所屬的一個或多個表單,form 屬性必須引用所屬表單的 id:

2.formaction
<form action="demo_form.asp" method="get">
  First name: <input type="text" name="fname" /><br />
  Last name: <input type="text" name="lname" /><br />
  <input type="submit" value="Submit" /><br />
  <input type="submit" formaction="demo_admin.asp" value="Submit as admin" />
</form>

formaction可以爲所有的提交按鈕添加不同的formaction屬性,使的在單擊不同的按鈕可以將表單提交到不同頁面。formaction 屬性覆蓋 form 元素的 action 屬性。

3.formmethod
<form action="demo-form.php" method="get">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit" value="提交">
  <input type="submit" formmethod="post" formaction="demo-post.php" value="使用 POST 提交">
</form>

formmethod屬性對每個表單元素分別指定不同的提交方。formmethod 屬性覆蓋 form 元素的 method 屬性。

4.formtarget
<form action="demo-form.php">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit" value="正常提交">
  <input type="submit" formtarget="_blank" value="提交到一個新的頁面上">
</form>

formtarget屬性用來指定提交後在何處打開所需要加載的頁面

描述
_blank 在新窗口/選項卡中顯示響應。
_self 在同一框架中顯示響應(默認)。
_parent $1
_top 在父框架中顯示響應。
手機 在整個窗口中顯示響應。
framename 在指定的 iframe 中顯示響應。
5.autofocus
<form action="demo_form.html"
	First name: <input type="text" name="fname" autofocus><br>
	Last name: <input type="text" name="lname"><br>
	<input type="submit">
</form>

autofocus 屬性規定當頁面加載時 input 元素應該自動獲得焦點。
autofocus 屬性是一個布爾屬性。
一個頁面只能有一個控件具有outofocus屬性

6.pattern
<form>     
請輸入指定格式的內容:        
<input type="text" pattern="[0-9][A-Z]{3}" name="part">        
<input type="submit" value="">    
</form>

pattern 屬性規定用於驗證輸入字段的模式

文章摘要:html5與css3權威指南、菜鳥教程

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章