form里边的button
form里面的buttonhtmlheadtitle测试form/titlemeta http-equivContent-Type contenttext/ht
form里面的button
<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">测试</button>
即可通用!
[解决办法]