1. 程式人生 > >form表單提交中,確定和取消效果的實現

form表單提交中,確定和取消效果的實現

前端開發中的資料提交,目前大多數採用表單提交的方式,但是對於很對初學者來說,只知道在表單格式中,只有一個<input type="submit">,如果有兩個或者要求有多個提交選擇的時候應該怎麼做呢,其實用js就可以簡單實現:

例如下面的效果:

有一個確定和取消的提交按鈕;

<form name="form" method="post" action=" " id="form">
 <b>註冊</b><br/><br/>
  <span style="letter-spacing:4.5px;">使用者名稱:</span> <input type="text" name="userName"><br/><br/>
     證件型別:&nbsp;&nbsp;
    <select  name="identifytype"  id="identifytype">
    <option value="身份證" >身份證</option>
    <option value="軍官證">軍官證</option>
    </select><br/><br/>
  <span style="letter-spacing:5px;">證件號:<input type="text" name="identifynum"><br/><br/>
  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <input type="submit" value="註冊"   onclick="javascript:this.form.action='跳轉.jsp';"/>
  <input type="submit" value="取消"  onclick="javascript:this.form.action='當前頁面.jsp';"/>

與平常的form提交不同之處在於:

1、此處的action為空,

2、在input中添加了點選事件:javascript:this.form.action

利用js的form.action去進行連結跳轉。