iOS tel：and mailto：links only with target =「_ blank」

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上運行。

我已經經歷了堆棧溢出和其他網站的很多帖子，我唯一可以找到的iOS的解決方案是添加target="_blank"。

雖然這可能是一些解決方案，但這對我來說還不夠好。將target="_blank"添加到鏈接會導致在桌面和Android上打開空白頁，從而導致不良的用戶體驗。

有沒有人能找到解決方案，將解決所有情況。

對於一些額外的信息，我正在使用最新的Bootstrap框架。

希望有人能幫忙。

Answer 1

這是一個遲到的答案，如果你甚至可以考慮這個答案，但我最近遇到了這種變化，並取得了一些進展。

基本上，你似乎確實需要target="_blank"的mailto鏈接讓他們在iOS/Safari（最近的版本）中一致地工作。

Android怎麼樣？經過一些測試 - 您也可以在Android/Chrome上安裝target="_blank"，只要旁邊沒有rel="noopener"即可。爲什麼？！誰知道？要麼沒有人打擾記錄這一點，要麼我的谷歌搜索權力讓我失望。

爲了您自己的理智進行測試： https://jsfiddle.net/f31psnhx/2/