Question

我知道这个问题已经发布了很多，但我无法找到适合我的全球解决方案。

我有以下HTML：

<div class="contact-details__content-container">
  <h4 class="contact-details__title">Press Enquiries</h4>

  <ul class="list-unstyled contact-details__list">
    <li class="contact-details__list-item">
      <span class="contact-details__name">Name Name</span>
      Job Title
    </li>
    <li class="contact-details__list-item">
      <span class="contact-details__name">Name Name</span>
      Job Title
    </li>
    <li class="contact-details__list-item">
      <a href="mailto:email@email.com" title="email@email.com" class="contact-details__email">email@email.com</a>
      <a href="tel:+442033333333" title="+44 (0)20 3333 3333" class="contact-details__telephone visible-xxs visible-xs">+44 (0)20 3333 3333</a>
    </li>
  </ul>

</div>

https://jsfiddle.net/4hyvdheu/2/

此处的mailto和tel链接在Android和桌面上运行完美，但在iOS上无效。

我在Stack Overflow和其他网站上发过很多帖子，我能为iOS找到的唯一解决方案是添加target="_blank"。

虽然这对某些人来说可能是一个解决方案，但这对我来说不是一个好的解决方案。将target="_blank"添加到链接会导致在桌面和Android上打开空白页面，从而产生糟糕的用户体验。

是否有人能够找到解决所有案例的解决方案。

对于一些额外的信息，我使用的是最新的Bootstrap框架。

希望有人可以提供帮助。

Answer 1

这是一个迟到的答案，如果你甚至可以考虑这个答案，但我最近遇到了一个变化，并取得了一些进展。

基本上，您似乎需要target="_blank" mailto链接才能在iOS / Safari中保持一致（在最新版本中）。

Android怎么样？经过一些测试后 - 只要您旁边没有target="_blank"，您就可以获得适用于Android / Chrome的rel="noopener"。为什么？！谁知道？无论是否有人打扰记录这个或我的谷歌搜索能力都让我失望。

为自己的理智进行测试： https://jsfiddle.net/f31psnhx/2/

iOS tel：和mailto：链接仅适用于target =＆＃34; _blank＆＃34;

1 个答案: