html - 在输入焦点上的 div 显示上添加链接

Question

当输入获得焦点时，我会显示工具提示。此工具提示是一个跨度:隐藏，但在输入具有焦点时显示(通过 CSS)。

input + .k-comments {
      display: none;
      max-width: 25em;
      color: #FFF;
      background: #283135;
      padding: 0.3rem;
      margin-top: 0.3rem;
      animation: appearance 2s forwards;
    }

    input:focus + .k-comments {
      display: block;
    }

<input id="myid" type="text"/>
<span class="k-comments">foo <a href="www.google.com">a link</a></span>

如果我点击工具提示(或其他任何地方)，它就会消失:好的。
问题:我的工具提示包含文本和链接 -> 我无法点击链接，因为工具提示先消失了。

Answer 1

可能不是最好的解决方案，但至少它使链接可点击:

input:focus + .k-comments,
.k-comments:active {
    display: block;
}