javascript - 标记 HTML 以允许右键单击上下文菜单中的 "open in a new tab"选项的正确方法

Question

我四处搜索，但似乎没有任何问题可以解决这个问题。

我有以下标记:

<li>
  <div class="box-brochure-slide" onclick="window.location='product.php?item=TEC%2FSR-888HP-SS';">
    <div class="boxInner-item">
            <div class="triangle-topright-cover"></div>
      <div class="triangle-topright-red"></div>
      <div class="label-limitedsets">LIMITED SETS</div>
      <img class="lazy" alt="" src="img/pixel.png" data-original="user/picture/TEC-SR-888HP-SS.jpg">
      <div class="ui content">
                <div class="productbrand">TECNO</div>
        <div class="productname">TECNO SR-888HP-SS 2 X HI POWER BURNERS, 1 X MED BURNER, <br>BATTERY AUTO IGNITION</div>
        <div class="price">
          <div class="specialprice"><div class="specialprice-name">Crazy Price</div><span class="pricecurrency">$</span>488<span class="pricecents">00</span></div>
          <div class="usualprice">U.P. $588.00</div>
        </div>
      </div>
    </div>
  </div>
</li>

但是，当我尝试右键单击 <li> 时在网页上，我没有在新选项卡中打开的选项。这里的标记有什么问题？

编辑:我在一些资料中读到 <a>会解决问题，但我不想包装整个 <li>在 anchor 标记中。有办法做到这一点吗？

注意:我不想右键单击以在新选项卡中打开。我只是希望有一个选项可以在我右键单击它时在新选项卡中打开。

Answer 1

虽然您不想使用该元素，但如果您将最顶层的 div 替换为“a”而保留类 ID 和 css 不变，您将通过“在新选项卡中打开”选项获得相同的外观和感觉