javascript - 防止按钮对 html 输入和按钮标签的影响

Question

我正在编写一个 Intranet MVC 应用程序，并希望所有按钮的外观和行为都相同。对于创建、详细信息、返回列表等操作，我使用 GET 方法，对于创建和保存，我使用 POST 方法。

我做了一点 CSS，所以按钮、a 和输入标签看起来是一样的:

input[type="submit"].actionButton,
button[type="submit"].actionButton,
a.actionButton,
a.actionButton:visited {
  background-color: transparent;
  padding: 4px;
  margin: 2px;
  font-family: sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1em;
  text-decoration: underline;
  border: none;
  cursor: pointer;
}

但是 input 和 button 标签都对鼠标按下事件有影响。我怎样才能防止这种情况发生？最好的解决方案是通过 CSS，但我还没有确定目标浏览器。主要是IE7和IE8。

这个问题的 javascript 解决方案也很好。

谢谢，
彼得

Answer 1

这是 IE 中按钮的默认行为。 这可以通过向 :active

上的按钮添加负填充来“撤消”(欺骗)

input[type="submit"]:active,
button[type="submit"]:active {
    padding: -1px 0 0 -1px;
}