2010-09-14 11 views
8

Tengo una página web móvil que muestra un extracto bancario. Algo como esto:Números de procesamiento HTML móvil

DATE   | DESCRIPTION    | AMOUNT 
--------------|--------------------------|--------------- 
Jan 2nd 2010 | Clothes     | USD 1.839.000 
Sep 23rd 2010 | Drinks     | USD 2.837.000 

estoy usando . como separador de miles ya que es nuestra configuración local para eso.

HTML es muy simple. Algo como esto:

<table> 
    <tr> 
     <td>DATE</td> 
     <td>Clothes</td> 
     <td>AMOUNT</td> 
    </tr> 
    <tr> 
     <td>Jan 2nd 2010</td> 
     <td>Clothes</td> 
     <td>USD 1.839.000</td> 
    </tr> 
    <tr> 
     <td>Sep 23rd 2010</td> 
     <td>Drinks</td> 
     <td>USD 2.837.000</td> 
    </tr> 
</table> 

El problema que estoy teniendo es que Safari, navegadores Android de iPhone y algunos navegadores de Nokia son pensamiento (erróneamente) los números tales como 1.839.000 y 2.837.000 son números de teléfono por lo tanto, haciéndolos como enlaces para hacer llamadas telefónicas o hacer algunos mensajes de texto.

Mi pregunta: ¿Hay un TAG/ATTRIBUTE/CSSSTYLE especial para decirle al navegador móvil que muestre ese tipo de texto como texto sin formato?

Muchas gracias.

+1

Interesante pregunta. ¿Agregar etiquetas span entre la ayuda ?: ' .837 .000' –

+0

@Pekka: déjame intentar eso. ¡Gracias! –

+0

@Pekka: ¡ayudo! –

Respuesta

24

no sé acerca de Android o Nokia, pero para iPhone se puede utilizar el meta tag:

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

para desactivar la detección de cualquier cosa como un número de teléfono.

+0

¡Increíble, finalmente algo que NO es ignorado por Opera Mobile Classic! Esto realmente funcionó, estoy tan emocionado que estoy a punto de llorar: P – andreszs

+0

Para mantener el click2call, pero elimine el efecto de subrayado azul: a [href^= tel] { color: inherit; texto-decoración: ninguno; } –

0

Longshot, pero, intente escribir el período como &#46; - hay códigos inteligentes que pueden desactivarlo para safari móvil, etc., pero eso solo funciona para uno o dos dispositivos. Si tienes suerte, pasarás por alto su expresión regular.

+0

Sí, esto (no tengo votos para hoy) o tal vez algún extraño personaje Unicode que parece un '.' como último recurso –

3

Así es como lo hace for the iPhone, que seems to work para Android también; es posible que funcione en otros navegadores, eso es todo lo que tengo para probar con piso en la actualidad

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

Como se ha discutido en los comentarios, añadiendo luces arbitrarias parece romper detección para el navegador en cuestión:

<span>2</span>.837<span>.000</span> 

, sin embargo, sería preferible una solución explícita en forma de un atributo "no analizar esto" o Metaetiqueta, ya que sería más cierto que funcionaría en el futuro y para la mayoría de las plataformas.

4

En caso de que quiera mantener la funcionalidad que reconoce el número de teléfono como tal y le permite tocar en ella, utiliza esta solución:

Desde iOS añade una etiqueta <a href="tel123456789"> alrededor del número, todo lo que tiene que hacer es hacer una regla CSS que los estilos de esta etiqueta:

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

mérito es de this Razor Edge Labs article.

Cuestiones relacionadas