iOS tel:和mailto:链接仅适用于target ="_ blank" [英] iOS tel: and mailto: links only work with target="_blank"
问题描述
我知道这个问题已经发布了很多，但是我找不到适合我的全局解决方案.
I know that this question has been posted around a lot but I am unable to find a global solution that works for me.
我有以下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上则无法工作.
The mailto and tel links here work perfectly on android and desktop but do not work on iOS.
我在Stack Overflow和其他网站上浏览了很多帖子，而我为iOS找到的唯一解决方案是添加target="_blank".
I have gone through many posts on Stack Overflow and other websites and the only solution I can find for iOS is to add target="_blank".
虽然这可能是某些解决方案，但对于我来说这还不够好.在链接中添加target="_blank"会导致空白页面在台式机和android上均打开，从而给用户带来不良的体验.
While this may be a solution for some this is not a good enough solution for me. Adding target="_blank" to the links causes blank pages to open on both desktop and android giving a bad user experience.
任何人都能够找到可以解决所有情况的解决方案.
Has anyone been able to find a solution that will solve all cases.
有关其他信息，我正在使用最新的Bootstrap框架.
For a little extra information I am using the latest Bootstrap framework.
希望有人可以提供帮助.
Hope someone can help.
推荐答案
这是一个较晚的答案，如果您甚至可以将其视为一个答案，但是我最近遇到了这种情况，并做了一些修改进度.
This is a bit of a late answer, if you can even consider this an answer at all, but I've recently encountered a variation of this and made some progress.
基本上，看来您确实需要target="_blank"的mailto链接，才能使它们在iOS/Safari(跨最新版本)中一致地工作.
Basically, it seems you do need target="_blank" for mailto links for them to work consistently in iOS/Safari (across recent versions).
Android呢?经过一些测试-只要您旁边没有rel="noopener"，您也可以将target="_blank"用于Android/Chrome.为什么?！谁知道?没人愿意记录下来，或者我的谷歌搜索功能使我失望了.
What about Android? After some testing - you can have target="_blank" for Android/Chrome as well, as long as you do NOT have rel="noopener" next to them. Why?! Who knows? Either nobody bothered documenting this or my googling powers have failed me.
根据您的理智对其进行测试: https://jsfiddle.net/f31psnhx/2/
Test it for your own sanity: https://jsfiddle.net/f31psnhx/2/
这篇关于iOS tel:和mailto:链接仅适用于target ="_ blank"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
