在写html页面,我们很自然的在表单提交的地方采用button来作为提交按钮,但是,用<button type=”button”>按钮</button>作为提交代码会有个问题,就是设置样式在不同浏览器可能会显示不同的样子,例如,下面的代码在不同浏览器就会有不同的效果:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title></title> </head> <body> <button type="button">自带button按键</button> </body> </html>
谷歌浏览器环境打开:
,鼠标移动到button,还是差不多的界面,没有变色
ie6浏览器打开:
,鼠标移动到button,颜色变了!
火狐浏览器打开:
鼠标移动到button
颜色也变了,但是颜色跟ie6下的不太一样,颜色更浅一点。
所以,html中button在不同浏览器下的显示效果是不同的,为了改变这个问题,我们用javascript:void(0)制作假的按键button。
基本思路:
用a标签做个按钮,制作按钮显示效果,当用户点击按钮,用ajax提交表单就可以。我这里就只做一个按钮。
具体代码就是下面这样:
<a href="javascript:void(0);" >提交</a>
剩下的工作就是制作你要的样式,随便做成什么样子都不会因为浏览器兼容导致样式不一样。