深入理解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权威指南、菜鸟教程

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