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

Web设计中，<input type="button" value="提交"/>与<input type="submit" value="提交"/>这两种按钮功能很容易让人搞混！
        submit类型的按钮用来提交表单；

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

[html]  view plain copy

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

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

[html]  view plain copy

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

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

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

[html]  view plain copy

1. <span style="font-size: 18px; "></span><pre name="code" class="html"><input type="button" value="提交" onclick="beforeSubmit();"/></pre><p></p>  
2. <pre></pre>  
3. 效果就可以出来了<br>  
4. <br>  
5. <p></p>  
6. <pre name="code" class="html"><pre></pre>  
7. <pre></pre>  
8. <pre></pre>  
9. <pre></pre>  
10. <pre></pre>  
11. <pre></pre>  
12.   
13. </pre>