时间戳

首页 > 解决方案 > 有没有办法在锚标签中有按钮，就像另一个链接？

html - 有没有办法在锚标签中有按钮，就像另一个链接？

问题描述

我试图有一个带有 onclick 事件的按钮，它就像另一个链接中的普通链接。

<a href="http://link1.com">
    <div>
        <h3>Some text</h3>
        <p>Some other text</p>
        <button onclick= 'window.location="http://www.google.de";'>Test</button>
    </div>
</a>

我希望能够单击整个 div 以访问 link1，但如果我单击该按钮，它应该会将我带到 google.de。有没有可能的方法？

标签： html

解决方案

这是一个糟糕的标记。为了您的理解，我修改了添加背景的片段。使用锚标记比使用带有 javascript 重定向的按钮更好，但我将按照您构建它的方式保留它。如果您打算将其更改为锚点，那么您需要添加 css 以使其看起来像一个按钮，或者如果您使用引导程序，请使用.btn.btn-primary 。

.item {
  position: relative;
  padding-bottom:20px;
  background: blue;
}
.item a {
  display: block;
  background: red;
}
.item button {
  display:inline-block;
  position: absolute;
  bottom: 0;
}
<div class="item">
  <a href="http://link1.com">
  <div>
    <h3>Some text</h3>
    <p>Some other text</p>
  </div>
  </a>
  <button onclick= 'window.location="http://www.google.de";'>Test</button>
</div>

推荐阅读