button跟submit的區別及使用js實現頁面跳轉的方式
阿新 • • 發佈:2019-02-02
button和submit的區別及使用js實現頁面跳轉的方式:
原文: http://blog.csdn.net/luosisan/article/details/17385657
- type=button //就單純是按鈕功能
- type=submit //是傳送表單
但是對於從事WEB UI的人應該要注意到,使用submit來提高頁面易用性:
使用submit後,頁面支援鍵盤enter鍵操作,而很多WEB軟體設計師,可能沒有注意到submit統
一。
用button後往往頁面不支援enter鍵了。所以需要支援enter鍵,必須要設定個submit,預設enter鍵對頁面第一個submit進行操作。
- <input type="submit" name="b1" value="提交" onClick="bt_submit_onclick()">
執行完onClick,轉到action。可以自動提交不需要onClick。所以說onclick這裡可以不要。
- <input type="button" name="b1" value="提交" onClick="bt_submit_onclick()">
執行完onClick,跳轉檔案在js檔案裡控制。提交需要onClick。
比如:
1、
-
onclick="form1.action='a.jsp';form1.submit();"
這樣就實現了submit的功能了。
2、
- <form name="form1" method="post" action="http://www.sina.com.cn">
- <input type="button" name="Button" value="Button" onClick="submit()">
- </form>
3、
-
<input type="button" name="Button" value="Button" onClick="javascript:windows.location.href="
js實現頁面跳轉的幾種方式:
第一種:
- <script language="javascript" type="text/javascript">
- function test(){
- window.location.href="login.jsp?backurl="+window.location.href;
- }
- </script>
第二種:
- <script language="javascript">
- function test(){
- alert("返回");
- window.history.back(-1);
- }
- </script>
第三種:
- <script language="javascript">
- window.navigate("top.jsp");
- </script>
第四種:
- <script language="JavaScript">
- function test(){
- self.location='top.htm';
- }
- </script>
第五種:
- <script language="javascript">
- function test(){
- alert("非法訪問!");
- top.location='xx.jsp';
- }
- </script>