如何添加＆＃34;按钮＆＃34;在＆＃34;锚＆＃34;标签 - 每个活动用途不同

Question

我设计了如下布局：

+-------------------------------------------+
| Product Name 1              [add to cart] |
|  Product brief                            |
+-------------------------------------------+
| Product Name 2              [add to cart] |
|  Product brief                            |
+-------------------------------------------+

事情如下所示（简化）：

<a href="/product-url">
   <span class="left">
      <h4>Product Name</h4>
      <p>Product Brief</p>
   </span>
   <span class="right>
     <input type="button" id="prod-id" value="add to cart">
   </span>
</a>

我希望激活整个产品块以锚定到产品，这就是我接受锚标签的原因。但是我也需要在点击时激活“添加到购物车”按钮。但是第一个锚标签不允许购物车按钮处于活动状态。我尝试了z-index，但失败了。

我尝试使用<div>而不是使用JavaScript重定向的锚标记，但同样的事情发生了，这就是我回到锚标记拥抱的原因。

我想：

• 让用户进入产品的锚标记
• 添加到购物车按钮（在锚标记内），让用户将产品添加到购物车

Answer 1

您可以使用按钮提交添加到购物车表单，并在完成后重定向到产品页面/在较旧的浏览器中，特别是混合使用无法正常工作。