Jak wyłączyć łączenie numerów telefonów w Mobile Safari?

Safari na iPhonie automatycznie tworzy łącza do ciągów cyfr pojawiających się na numerach telefonów. Piszę stronę internetową zawierającą adres IP, a Safari zmienia go w link do numeru telefonu. Czy można wyłączyć to zachowanie dla całej strony lub elementu na stronie?

To wydaje się być słuszne, według Reference Safari HTML :

<meta name="format-detection" content="telephone=no">

Jeśli to wyłączysz, ale nadal chcesz mieć łącza telefoniczne, nadal możesz używać schematu URI „tel”.

Oto odpowiednia strona w bibliotece programistów Apple.

Aby wyłączyć wygląd parsowania telefonu dla określonych elementów, ten CSS wydaje się załatwić sprawę:

.element { pointer-events: none; }
.element > a { text-decoration:none; color:inherit; }

Pierwsza reguła wyłącza kliknięcie, druga zajmuje się stylizacją.

Używam stolarki o zerowej szerokości ‍

Po prostu umieść to gdzieś w numerze telefonu i to działa dla mnie. Testowane w BrowserStack (i Litmus dla wiadomości e-mail).

Miałem ten sam problem. Znalazłem właściwość na UIWebView, która pozwala wyłączyć detektory danych.

self.webView.dataDetectorTypes = UIDataDetectorTypeNone;

Dodaj to, myślę, że tego właśnie szukasz:

<meta name = "format-detection" content = "telephone=no">

Rozwiązanie dla Webview!

W przypadku aplikacji PhoneGap-iPhone / PhoneGap-iOS można wyłączyć wykrywanie numeru telefonu, dodając następujące elementy do delegata aplikacji projektu:

// ...

- (void)webViewDidStartLoad:(UIWebView *)theWebView 
{
    // disable telephone detection, basically <meta name="format-detection" content="telephone=no" />
    theWebView.dataDetectorTypes = UIDataDetectorTypeAll ^ UIDataDetectorTypePhoneNumber;

    return [ super webViewDidStartLoad:theWebView ];
}

// ...

źródło: Wyłącz wykrywanie telefonu w PhoneGap-iOS .

Aby wyłączyć wykrywanie numeru telefonu na części strony, zawiń zmieniony tekst w tagu kotwicy za pomocą href = "#". Jeśli to zrobisz, mobilne Safari i UIWebView powinny pozostawić to w spokoju.

<a href="#"> 1234567 </a>

Myślę, że znalazłem rozwiązanie: wstaw liczbę do <label>elementu. Nie próbowałem żadnych innych tagów, ale <div>pozostawiłem aktywne na ekranie głównym, nawet ztelephone=no atrybutem.

Wydaje się oczywiste z wcześniejszych komentarzy, że metatag działał, ale z jakiegoś powodu zepsuł się w późniejszych wersjach iOS, przynajmniej pod pewnymi warunkami. Korzystam z wersji 4.0.1.

Możesz także użyć <a>etykiety javascript: void(0)jako hrefwartości.

Przykład jak następuje:
<a href="javascript: void(0)">+44 456 77 89 87</a>

Miałem ten sam problem, ale w aplikacji internetowej na iPada.

Niestety ani ...

 <meta name = "format-detection" content = "telephone=no">

ani ...

0 = 0
9 = 9

... pracował.

Ale oto trzy brzydkie hacki:

• zastępując cyfrę „0” literą „O”
• zastępując cyfrę „1” literą „l”
• wstaw zakres bez znaczenia: np. 555.5<span>5</span>5.5555

W zależności od użytej czcionki pierwsze dwa są ledwo zauważalne. Ten ostatni oczywiście zawiera zbędny kod, ale jest niewidoczny dla użytkownika.

Kludgy z pewnością włamuje się i prawdopodobnie nie jest opłacalne, jeśli generujesz kod dynamicznie z danych lub jeśli nie możesz w ten sposób skazić swoich danych.

Ale wystarczy w mgnieniu oka.

Miałem numer ABN (Australian Business Number), który iPad Safari nalegał, aby zmienić go w link do numeru telefonu. Żadna z sugestii nie pomogła. Moim rozwiązaniem było umieszczenie znaczników img między liczbami.

ABN 98<img class="PreventSafariFromTurningIntoLink" /> 009<img /> 675<img /> 709

Klasa istnieje tylko w celu udokumentowania, do czego służą tagi img.

Działa na iPad 1 (4.3.1) i iPad 2 (4.3.3).

Moje doświadczenie jest takie samo, jak niektóre inne wspomniane. Metatag ...

<meta name = "format-detection" content = "telephone=no">

... działa, gdy witryna działa w Mobile Safari (tj. z Chrome), ale przestaje działać, gdy działa jako aplikacja internetowa (tzn. jest zapisywana na ekranie głównym i działa bez Chrome).

Moim niezbyt idealnym rozwiązaniem jest wstawienie wartości do pól wejściowych ...

<input type="text" readonly="readonly" style="border:none;" value="3105551212">

Jest to mniej niż idealne, ponieważ pomimo ustawienia granicy na brak, iOS renderuje szary piksel ponad polem. Ale to lepsze niż postrzeganie numeru jako linku.

Sam to przetestowałem i stwierdziłem, że działa, choć z pewnością nie jest to eleganckie rozwiązanie. Wstawienie pustego zakresu do numeru telefonu zapobiegnie przekształceniu go przez detektory danych w łącze.

(604) 555<span></span> -4321

<meta name = "format-detection" content = "telephone=no"> nie działa w przypadku wiadomości e-mail: jeśli przygotowywany kod HTML dotyczy wiadomości e-mail, metatag zostanie zignorowany.

Jeśli celujesz w e-maile, oto jeszcze jedno brzydkie, ale działa rozwiązanie:

Przykład kodu HTML, który chcesz uniknąć łączenia lub automatycznego formatowania:

will cease operations <span class='ios-avoid-format'>on June 1,
2012</span><span></span>.

I CSS, który sprawi, że magia się wydarzy:

@media only screen and (device-width: 768px) and (orientation:portrait){
span.ios-date{display:none;}
span.ios-date + span:after{content:"on June 1, 2012";}
}

Wada: może być potrzebne zapytanie o media dla każdej kombinacji pionowej / poziomej na iPadzie / iPhonie

Możesz spróbować zakodować je jako encje HTML:

0 = 0
9 = 9

Ten sam problem w aplikacji Sencha Touch rozwiązany za pomocą meta tag ( <meta name="format-detection" content="telephone=no">) w index.html aplikacji.

Sztuczka, której używam, która działa nie tylko na Mobile Safari, polega na użyciu kodów ucieczki HTML i niewielkiej narzuty w numerze telefonu. Utrudnia to przeglądarce „identyfikację” numeru telefonu, tj

Phone: 1-8&#48;&#48;<span>-</span>62&#48;<span>-</span>38&#48;3

Ja też mam ten problem: Safari i inne przeglądarki mobilne przekształcają identyfikatory VAT w numery telefonów. Chcę więc czystej metody, aby uniknąć tego na pojedynczym elemencie, a nie na całej stronie (lub witrynie).
Dzielę się możliwym rozwiązaniem, które znalazłem, jest nieoptymalne, ale nadal jest całkiem realne: umieszczam wewnątrz liczby, której nie chcę stać się tel:linkiem, ⁠encja HTML, która jest niewidoczną postacią łączącą słowa . Próbowałem pozostać bardziej semantyczny (cóż, przynajmniej w pewnym sensie), umieszczając ten znak w jakimś sensownym miejscu, np. W przypadku identyfikatora VAT wybrałem umieszczanie go między różnymi grupami cyfr zgodnie z jego formatem, więc dla włoskiego podatku VAT I napisał: 0613605⁠048⁠8który renderuje w 0613605⁠048⁠8 i nie jest przekształcany w numer telefonu.

Inną opcją jest zastąpienie łączników w numerze telefonu znakiem ‑(U + 2011 „Unicode Non-Breaking Hyphen”)

Przez chwilę byłem bardzo zdezorientowany, ale w końcu to rozgryzłem. Dokonaliśmy aktualizacji naszej witryny i niektóre numery zostały przekonwertowane na link, a niektóre nie. Okazuje się, że liczby nie zostaną przekonwertowane na link, jeśli znajdują się w <polu zestawu>. Oczywiście nie jest to właściwe rozwiązanie w większości przypadków, ale w niektórych przypadkach będzie to właściwe.

Ta odpowiedź przebija wszystko w dniach 6-13-2012:

<a href="#" style="color: #666666; 
                   text-decoration: none;
                   pointer-events: none;">
  Boca Raton, FL 33487
</a>

Zmień kolor na dowolny, dopasowujący się do tekstu, dekoracja tekstu usuwa podkreślenie, zdarzenia wskaźnika uniemożliwiają oglądanie go jak łącza w przeglądarce (wskaźnik nie zmienia się w dłoń)

Jest to idealne rozwiązanie do wiadomości e-mail HTML na iOS i przeglądarce.

Dlaczego chcesz usunąć linkowanie, dzięki temu masz bardzo przyjazną dla użytkownika opcję.

Jeśli chcesz po prostu usunąć automatyczną edycję, ale nadal działasz, po prostu dodaj to do swojego CSS ...

a[href^=tel] {
 color: inherit;
 text-decoration:inherit;
}

Podziel liczbę na osobne bloki tekstu

301 <div style="display:inline-block">441</div> 3909

Innym rozwiązaniem byłoby użycie obrazu numeru IP