form里边的button
日期：2014-05-16 浏览次数：20239 次
form里面的button
没有给button绑定任何事件，但是点击button页面还是刷新了，这个是为什么呢？
是from自身的设定还是其他原因？高手解答一下，谢谢！
------解决方案--------------------
使用Firefox依次浏览，就能看到input和button的区别：input提交按钮显示的文字就是value，而button提交按钮显示的文字和value是独立的，从这个意义上来看，button更有表现力，是更值得推荐的提交按钮实现方式。
可惜IE总是拖后腿，使用IETester里的IE6，7，8分别浏览，就会发现button提交按钮在IE下有Bug：
首先，在IE6里，如果一个表单里有多个button形式的提交按钮，那么不管你点击其中哪个按钮，所有的button按钮都会被提交，而在IE7，8里则点击哪个按钮，才提交哪个button按钮。此时，如果想在服务端判断用户点击了哪个按钮，只能使用Javascript来处理。
另外，在IE6，7，8里，button形式的按钮在提交后，value属性都失效了，显示文字取代了value。
总结：从理论上来看，button形式的提交按钮优于input形式的提交按钮。但如果考虑浏览器通用性，很多时候还是只能使用input形式的提交按钮。
------解决方案--------------------
确实， 在firefox 下有提交动作。 楼主还是老老实实用 input 的按钮吧。
下面这样就不会有了：
------解决方案--------------------
注意了：<button>测试</button>没有指定type在firefox默认是提交按钮.所以你只要写成：<button type="button">测试</but
<html>
<head>
<title>测试form</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
</head>
<body>
<form>
<input type="text"></input>
<input type="text"></input>
<button>测试</button>
</form>
<script type="text/javascript">
$(document).ready(function(){alert('refurbish');});
</script>
</body>
</html>
没有给button绑定任何事件，但是点击button页面还是刷新了，这个是为什么呢？
是from自身的设定还是其他原因？高手解答一下，谢谢！
------解决方案--------------------
使用Firefox依次浏览，就能看到input和button的区别：input提交按钮显示的文字就是value，而button提交按钮显示的文字和value是独立的，从这个意义上来看，button更有表现力，是更值得推荐的提交按钮实现方式。
可惜IE总是拖后腿，使用IETester里的IE6，7，8分别浏览，就会发现button提交按钮在IE下有Bug：
首先，在IE6里，如果一个表单里有多个button形式的提交按钮，那么不管你点击其中哪个按钮，所有的button按钮都会被提交，而在IE7，8里则点击哪个按钮，才提交哪个button按钮。此时，如果想在服务端判断用户点击了哪个按钮，只能使用Javascript来处理。
另外，在IE6，7，8里，button形式的按钮在提交后，value属性都失效了，显示文字取代了value。
总结：从理论上来看，button形式的提交按钮优于input形式的提交按钮。但如果考虑浏览器通用性，很多时候还是只能使用input形式的提交按钮。
------解决方案--------------------
确实， 在firefox 下有提交动作。 楼主还是老老实实用 input 的按钮吧。
下面这样就不会有了：
<html>
<head>
<title>测试form</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){alert('refurbish');});
</script>
</head>
<body>
<form>
<input type="text"/>
<input type="text"/>
<input type="button" value="测试" />
</form>
</body>
</html>
------解决方案--------------------
注意了：<button>测试</button>没有指定type在firefox默认是提交按钮.所以你只要写成：<button type="button">测试</but
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
