Como desativar a vinculação de números de telefone no Mobile Safari?

O Safari no iPhone cria automaticamente links para cadeias de dígitos que aparecem nos números de telefone. Estou escrevendo uma página da Web que contém um endereço IP e o Safari está transformando isso em um link de número de telefone. É possível desabilitar esse comportamento para uma página inteira ou um elemento em uma página?

Esta parece ser a coisa certa a fazer, de acordo com a Referência HTML do Safari :

 

Se você desabilitar isso, mas ainda quiser links de telefone, ainda poderá usar o esquema de URI “tel”.

Aqui está a página relevante na Biblioteca de Desenvolvedores da Apple.

Eu estava tendo o mesmo problema. Eu encontrei uma propriedade no UIWebView que permite que você desligue os detectores de dados.

 self.webView.dataDetectorTypes = UIDataDetectorTypeNone; 

Para desativar a aparência de parsing do telefone para elementos específicos, este CSS parece fazer o truque:

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

A primeira regra desabilita o clique, o segundo cuida do estilo.

Adicione isso, acho que é o que você está procurando:

  

Eu uso um marceneiro de largura zero

Basta colocar isso em algum lugar no número de telefone e funciona para mim. Testado no BrowserStack (e Litmus para emails).

Solução para Webview!

Para aplicativos PhoneGap-iPhone / PhoneGap-iOS, você pode desativar a detecção do número de telefone adicionando o seguinte ao delegado do aplicativo do seu projeto:

 // ... - (void)webViewDidStartLoad:(UIWebView *)theWebView { // disable telephone detection, basically  theWebView.dataDetectorTypes = UIDataDetectorTypeAll ^ UIDataDetectorTypePhoneNumber; return [ super webViewDidStartLoad:theWebView ]; } // ... 

fonte: Desativar a detecção de telefone no PhoneGap-iOS .

Acho que encontrei uma solução: coloque o número dentro de um elemento . Não tentei nenhuma outra tag, mas

deixou ativa na canvas inicial, mesmo com o atributo telephone=no .

Parece óbvio, a partir dos comentários anteriores, que a meta tag funcionou, mas, por algum motivo, quebrou nas versões posteriores do iOS, pelo menos sob algumas condições. Eu estou executando 4.0.1.

Para desativar a detecção do número de telefone em parte de uma página, coloque o texto afetado em uma marca de âncora com href = “#”. Se você fizer isso, o Safari móvel e o UIWebView deverão deixá-lo em paz.

  1234567  

Eu tive o mesmo problema, mas em um aplicativo da web para iPad.

Infelizmente, nem …

   

nem …

 0 = 0 9 = 9 

… funcionou.

Mas aqui estão três hacks feios:

  • substituindo o número “0” pela letra “O”
  • substituindo o número “1” pela letra “l”
  • insira uma extensão sem sentido: por exemplo, 555.555.5555

Dependendo da fonte que você usa, os dois primeiros são quase imperceptíveis. Este último obviamente envolve código supérfluo, mas é invisível para o usuário.

O Kludgy hacks com certeza, e provavelmente não é viável se você está gerando seu código dinamicamente a partir de dados, ou se você não pode poluir seus dados dessa maneira.

Mas, suficiente em uma pitada.

Eu tinha um ABN (Australian Business Number) que o iPad Safari insistia em transformar em um link de número de telefone. Nenhuma das sugestões ajudou. Minha solução foi colocar tags img entre os números.

 ABN 98 009 675 709 

A class existe apenas para documentar para que servem as tags img.

Funciona no iPad 1 (4.3.1) e iPad 2 (4.3.3).

Minha experiência é a mesma de alguns outros mencionados. A meta tag …

  

… funciona quando o site está sendo executado no Mobile Safari (ou seja, com o chrome), mas para de funcionar quando executado como um webapp (isto é, é salvo na canvas inicial e executado sem o chrome).

Minha solução menos que ideal é inserir os valores em campos de input …

  

É menos que ideal porque, apesar de a borda estar definida como nenhuma, o iOS renderiza uma barra cinza de vários pixels acima do campo. Mas é melhor do que ver o número como um link.

Você também pode usar o label com javascript: void(0) como valor href .

Exemplo como segue:
+44 456 77 89 87

Eu testei isso sozinho e descobri que funciona, embora certamente não seja uma solução elegante. Inserir um intervalo vazio no número de telefone impedirá que os detectores de dados o transformem em um link.

 (604) 555 -4321 

não funciona para e-mails: se o HTML que você está preparando for para um e-mail, a metatag será ignorada.

Se o que você está segmentando são e-mails, aqui está outra solução feia, mas que funciona para você:

Exemplo de algum HTML que você deseja evitar que seja vinculado ou formatado automaticamente:

 will cease operations on June 1, 2012. 

E o CSS que fará a mágica acontecer:

 @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";} } 

A desvantagem: você pode precisar de uma consulta de mídia para cada um dos combos de retrato / paisagem do ipad / iphone

Você pode tentar codificá-los como entidades HTML:

 0 = 0 9 = 9 

O mesmo problema no aplicativo Sencha Touch foi resolvido com a metatag ( ) em index.html do aplicativo.

Esta resposta supera tudo a partir de 6-13-2012:

  Boca Raton, FL 33487  

Alterar a cor para o que corresponde ao seu texto, a decoração de texto remove o sublinhado, os events de ponteiro impedem que ele seja visto como um link em um navegador (ponteiro não muda para uma mão)

Isso é perfeito para e-mails em HTML no ios e no navegador.

Um truque que eu uso que funciona em mais do que apenas o Mobile Safari é usar códigos de escape HTML e um pequeno aumento no número de telefone. Isso torna mais difícil para o navegador “identificar” um número de telefone,

 Phone: 1-800-620-3803 

Por que você deseja remover a vinculação, isso torna muito amigável ter a opção.

Se você simplesmente deseja remover a edição automática, mas mantenha o link funcionando, basta adicionar isso ao seu CSS …

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

Eu também tenho esse problema: o Safari e outros navegadores móveis transformam os IDs de IVA em números de telefone. Então eu quero um método limpo para evitá-lo em um único elemento, não a página inteira (ou site).
Estou compartilhando uma possível solução que encontrei, é sub-ótima, mas ainda é bastante viável: eu coloquei, dentro do número que eu não quero me tornar um link tel: , o Entidade HTML que é o caractere invisível do Word-Joiner . Eu tentei ficar mais semântico (bem, pelo menos uma espécie de) colocando esse caractere em algum ponto significativo, por exemplo, para o ID do IVA que escolhi para colocá-lo entre os diferentes grupos de dígitos de acordo com seu formato escreveu: 0613605⁠048⁠8 que processa em 0613605⁠048⁠8 e não é transformado em um número de telefone.

Outra opção é replace os hifens em seu número de telefone pelo caractere (U + 2011 ‘Unicode Non-Breaking Hyphen’)

Fiquei muito confuso com isso por um tempo, mas finalmente descobri. Fizemos atualizações no nosso site e tivemos alguns números convertendo para um link e outros não. Acontece que os números não serão convertidos em um link se estiverem em um

. Obviamente não é a solução certa para a maioria das circunstâncias, mas em alguns será a correta.

Divida o número em blocos separados de texto

 301 
441
3909

Outra solução seria usar uma imagem do número IP