Question

这是我的 PUG / JADE 代码在

之下

a(href="#card")
  div.tile 
    h1 open card

    #card
      a(href="#") click to close

但此代码无法正确打印，.tile已打印出<a>，你可以查看下面的印刷代码。

<a href="#card"></a>
<div class="tile"> 
  <a href="#card">
    <h1>Open card</h1>
  </a>

  <div id="card">
    <a href="#card"></a>
    <a href="#">click to close</a>
  </div>
</div>

我需要这样的代码：

<a href="#card">
  <div class="tile"> 
    <h1>Open card</h1>
    <div id="card">
      <a href="#">click to close</a>
    </div>
  </div>
</a>

Answer 1

链接中的链接是无效的HTML。 Jade可能在内部使用HTML构建器来修正语法。如果您手动编写自己想要的HTML并在浏览器中查看它，您应该会看到相同的结果 - 它会将第二个a标记移到第一个之外。

Answer 2

我有一个类似的用例，我需要一个DOM元素，在div内部有一个单击处理程序，它位于一个锚标记内。

我使用了span作为内部可点击元素，并使用了JavaScript函数addEventListener。请记住在内部可点击元素上使用event.preventDefault（），因此不要在封闭的锚标记上触发href。

Jade / PUG在其他内部插入标签a

2 个答案: