button跟submit的区别及使用js实现页面跳转的方式

button和submit的区别及使用js实现页面跳转的方式：

原文：  http://blog.youkuaiyun.com/luosisan/article/details/17385657

[java]  view plain  copy

1. type=button      //就单纯是按钮功能     
2. type=submit      //是发送表单  

但是对于从事WEB UI的人应该要注意到，使用submit来提高页面易用性：
使用submit后，页面支持键盘enter键操作，而很多WEB软件设计师，可能没有注意到submit统
一。

用button后往往页面不支持enter键了。所以需要支持enter键，必须要设置个submit，默认enter键对页面第一个submit进行操作。

[java]  view plain  copy

1. <input type="submit" name="b1" value="提交" onClick="bt_submit_onclick()">  

执行完onClick，转到action。可以自动提交不需要onClick。所以说onclick这里可以不要。

[java]  view plain  copy

1. <input type="button" name="b1" value="提交" onClick="bt_submit_onclick()">  

执行完onClick，跳转文件在js文件里控制。提交需要onClick。

比如：
1、

[java]  view plain  copy

1. onclick="form1.action='a.jsp';form1.submit();"   

这样就实现了submit的功能了。

2、

[java]  view plain  copy

1. <form name="form1" method="post" action="http://www.sina.com.cn">     
2.     <input  type="button"  name="Button"  value="Button"  onClick="submit()">     
3.  </form>  

3、

[java]  view plain  copy

1. <input type="button" name="Button" value="Button"    onClick="javascript:windows.location.href="你的url"">  

js实现页面跳转的几种方式：

第一种：

[js]  view plain  copy

1. <script language="javascript" type="text/javascript">  
2.   function   test(){   
3.      window.location.href="login.jsp?backurl="+window.location.href;   
4.    }  
5. </script>  

第二种：

[js]  view plain  copy

1. <script language="javascript">  
2.   function   test(){   
3.      alert("返回");  
4.      window.history.back(-1);  
5.   }  
6. </script>  

第三种：

[js]  view plain  copy

1. <script language="javascript">  
2. window.navigate("top.jsp");  
3. </script>  

第四种：

[js]  view plain  copy

1. <script language="JavaScript">  
2.    function   test(){   
3.      self.location='top.htm';  
4.     }  
5. </script>  

第五种：

[js]  view plain  copy

1. <script language="javascript">  
2.   function   test(){   
3.      alert("非法访问！");  
4.      top.location='xx.jsp';  
5.    }  
6. </script>