利用javascript:void(0)制作假的提交按钮替代button

在写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>

剩下的工作就是制作你要的样式,随便做成什么样子都不会因为浏览器兼容导致样式不一样。

本人博客地址:利用javascript:void(0)制作假的提交按钮替代button

原文地址:https://www.cnblogs.com/jianqingwang/p/6944671.html