Web中button和submit两种按钮类型的区别

Web设计中，与这两种按钮功能很容易让人搞混！
        submit类型的按钮用来提交表单；

       input类型的按钮一般都有onclick属性来执行脚本
        很多人问，到底这两个类型谁可以替代谁！其实这两个类型的按钮在web设计中，各有所长！
submit类型的按钮支持enter键，这是为什么很多网站在输入完用户名和密码之后，可以直接按enter键进行登录！
button的功能不是这样！比如有如下脚本：

 <span style="font-size:18px;">   function beforeSubmit(){
     if(condition){
     $('div').css("border","solid red");
     return false;
     }
     }span>

当我们点击提交按钮的时候

 <span style="font-size:18px;"><input type="submit" value="提交" onclick="beforeSubmit();"/>span>

可以很遗憾的告诉你，你的脚本效果是显示不出来的！因为submit不仅执行onclick方法，同时也提交表单！提交表单的同时，页面就被刷新了。你的return false

根本没有起到阻止表单提交的作用，而如果换成下面：

 <span style="font-size: 18px; ">span><pre name="code" class="html"><input type="button" value="提交" onclick="beforeSubmit();"/>pre><p>p>
 <pre>pre>
 效果就可以出来了<br>
 <br>
 <p>p>
 <pre name="code" class="html"><pre>pre>
 <pre>pre>
 <pre>pre>
 <pre>pre>
 <pre>pre>
 <pre>pre>

 pre>