2017-03-16 1 views
0

이 질문은 많이 게시되었지만 저에게 적합한 글로벌 솔루션을 찾을 수 없습니다.iOS tel : 및 mailto : 링크는 target = "_ blank"와 만 작동합니다.

<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 protected]" title="[email protected]" class="contact-details__email">[email protected]</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/

가 여기 mailtotel 링크가 안드로이드 및 데스크톱에서 완벽하게 작동하지만, iOS에서 작동하지 않습니다

나는 다음과 같은 HTML이있다.

스택 오버플로 및 다른 웹 사이트에서 많은 게시물을 읽었으며 iOS에서 찾을 수있는 유일한 해결책은 target="_blank"을 추가하는 것입니다.

일부 솔루션이 될 수 있지만 이것은 나를위한 충분한 해결책이 아닙니다. 링크에 target="_blank"을 추가하면 바탕 화면과 안드로이드 모두에서 빈 페이지가 열리 며 나쁜 사용자 환경을 제공합니다.

누구나 모든 문제를 해결할 솔루션을 찾을 수 있습니까?

약간의 추가 정보는 최신 부트 스트랩 프레임 워크를 사용하고 있습니다.

누군가가 도움을 줄 수 있기를 바랍니다.

답변

1

이 답변은 조금이라도 늦을 수 있습니다.이 답변을 전혀 고려하지 못할 수도 있지만 최근에이 변형이 발생하여 몇 가지 진전을 보았습니다.

기본적으로 iOS/Safari (최근 버전)에서 일관되게 작동하는 mailto 링크는 target="_blank" 링크가 필요합니다.

Android는 어떤가요? 테스트를 마친 후에는 rel="noopener"이없는 한 Android/Chrome 용으로도 target="_blank"을 사용할 수 있습니다. 왜?! 누가 알아? 아무도 이것을 문서화하지 않거나 내 인터넷 검색 능력은 나를 실패했습니다.

자신의 온전함을 테스트 해보십시오. https://jsfiddle.net/f31psnhx/2/

관련 문제