CSS按钮不工作在IE，但在FF

Question

我一直在互联网上寻找解决方案，为什么IE7不能正确打开链接，例如

    <a href="http://www.google.com"><button class="class1">Google</button></a>

IE7不喜欢吗?

我听说我应该使用jquery ?但没人跟任何文章有联系。

Answer 1

根据W3C关于锚(<a>)标签和<button>标签的规范，您应该能够做到这一点，但根据快速的谷歌搜索，您不能和/或不应该这样做，而且它在Internet Explorer中不起作用。

这篇文章实际上建议添加Javascript，这样链接也可以在IE中打开:

<a href="http://www.expertsguide.info/"><button type="button" onclick="window.location('http://www.expertsguide.info/')">Click Me to go to Experts Guide</button></a>

Answer 2

虽然你可以，你不应该在锚(<a>)里面有一个按钮(<button>)

为按钮添加一个事件处理程序，如下所示:

<input type="button" value="Google" onClick="javascript:location.href = 'http://google.com';" />

注意:出于各种原因，您应该考虑不要这样做。总之，你可以(也应该)把你的<a>元素设计得像一个按钮。

Answer 3

最好不要在超链接中使用按钮。

将超链接样式设置为按钮样式。

试试这些http://www.webresourcesdepot.com/css3-buttons-10-awesome-ready-to-use-solutions-all-related-tutorials-you-need/

Answer 4

试试这个:

<script>
$(document).ready(function() {
   $('.class1').click(function() {
      window.location = $(this).parent().attr('href');
      return false;
   }
});
</script>

或者直接删除按钮标签，并使用:

<script>
$(document).ready(function() {
   $('a').click(function() {
      window.location = $(this).attr('href');
      return false;
   }
});
</script>

Answer 5

要独立于JavaScript(因此它也可以在禁用JS的浏览器上工作，与这里的许多其他答案相反)，我建议只是以通常的方式将其包装在<form>中，并使其成为<button type="submit">(或<input type="submit">)。

<form action="http://www.google.com">
  <button type="submit" class="class1">Google</button>
</form>

或

<form action="http://www.google.com">
  <input type="submit" value="Google" class="class1" />
</form>