写个简单的demo看下javascript
<button onclick="aa(this);">click</button>
<script type="text/javascript">
function aa(obj){
obj.innerHTML=0;
}
</script>
这并不会触发浏览器页面刷新效果，加个form表单试试html
<form>
<button onclick="aa(this);">click</button>
</form>
<script type="text/javascript">
function aa(obj){
obj.innerHTML=0;
}
</script>
结果就刷新页面了，为何呢？java
研究发现原来button这个控件在form表单里面的时候默认是submit类型的，会提交表单，怎么办呢？浏览器
（IE的默认类型是 "button"，而其余浏览器中（包括W3C规范）的默认值是"submit"）this
一、加return false；code
<form>
<button onclick="aa(this);return false">click</button>
</form>
<script type="text/javascript">
function aa(obj){
obj.innerHTML=0;
}
</script>
二、添加类型type="button"orm
<form>
<button type="button" onclick="aa(this);">click</button>
</form>
<script type="text/javascript">
function aa(obj){
obj.innerHTML=0;
}
</script>
三、改用inputhtm
<form>
<input type="button" onclick="aa(this)" value="click">
</form>
<script type="text/javascript">
function aa(obj){
obj.value=0;
}
</script>
总结：
当在IE浏览器下面时，button标签，input标签type属性为button是同样的功能，不会对表单进行任何操做。
可是在W3C浏览器，如Firefox下，button会提交表单，而input标签type属性为button不会对表单进行任何操做。ip
另外要注意的是：input
表单中使用button，不一样的浏览器会提交不一样的值。IE提交 <button> 与 <button/> 之间的文本，而其余浏览器将提交 value 属性的内容，因此在表单中尽可能使用 input 元素来建立按钮。