tag link ejemplos div attribute html uri url-scheme

link - td title html



¿Hay alguna forma de saber si un usuario final podrá manejar los enlaces de<a href= conectar- (5)

Por lo que puedo decir, no parece ser una buena forma confiable de hacer esto. Depende de qué software esté instalado además del navegador y, como tal, no creo que esté expuesto a una página web (de lo contrario, puede usarlo para verificar si el usuario tiene algún software instalado, especialmente con enlaces específicos de aplicaciones como iTunes o Visual estudio).

EDITAR: Como se señaló en los comentarios, Firefox intenta navegar y, en su lugar, muestra una página de error que muestra que la solución a continuación no funciona para Firefox.

Una alternativa a esto es simplemente manejar a alguien que hace clic en él y no funciona decentemente. Al probar con Chrome, parece que el navegador simplemente no hace nada si no se reconoce el protocolo, por lo que simplemente puede agregar un clic que toma la parte después de tel: y transformar click to call al número real. Entonces, al hacer clic en él, se muestra el número si no tienen nada instalado, lo que quizás sea un compromiso decente.

Entonces, si quieres vincular a un número de teléfono, harías algo como

<a href="tel:18005555555">Click to Call</a>

Esto se usa comúnmente en sitios web móviles y también está ganando terreno en los sitios de escritorio (creo que en gran parte gracias a Skype). Sin embargo, algunas computadoras / dispositivos no pueden admitirlo. ¿Hay alguna forma de saber si un usuario puede manejar tel: links?

La solución puede ser del lado del servidor o del lado del cliente, pero me imagino que tendría que ser del lado del cliente.


Por lo que sé, la detección de las capacidades / aplicaciones de un usuario puede ser complicada por razones de seguridad, pero puede descartar algunas cosas y partir de ahí.

Puede intentar ver su navegador móvil que puede manejar el enlace, y luego, si no, ver si el otro dispositivo es capaz de usar un número de teléfono, por ejemplo, Skype, y nuevamente si no, solo muestra un número normal.

¿Esto combina las respuestas de estas preguntas a href tel y navegadores estándar y Javascript para detectar Skype?

<div> <?php if(strstr(strtolower($_SERVER[''HTTP_USER_AGENT'']), ''mobile'') || strstr(strtolower($_SERVER[''HTTP_USER_AGENT'']), ''android'')) { echo ''<div id="tel"><a href="tel:123456">123456</a></div>''; }else{?> <script> function skype (failureFunction) { var $ = jQuery; if ($.browser.safari || $.browser.opera) { return true; } else if ($.browser.msie) { try { if (new ActiveXObject("Skype.Detection")) return true; } catch(e) { } } else { if (typeof(navigator.mimeTypes["application/x-skype"]) == "object") { return true; } } $(''a[href^="skype:"]'').click(function() { failureFunction(); return false; }); return false; } jQuery(function($) { if (skype()) { $(''div#tel'').html("<a href=''skype:123456''>123456</a>"); } else { $(''div#tel'').html("<p>123456</p>"); }; }); </script> <div id="tel"></div> <?}?>

Espero que sea un paso en la dirección correcta para usted.


Solo un pensamiento, pero si ingresa la siguiente información de encabezado

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

Podrá ingresar números de teléfono sin el prefijo tel: (o incluso un ancla) y el navegador los convertirá automáticamente a enlaces de teléfonos en los que se puede hacer clic.

Creo que esto puede ser más confiable que la detección de características o agentes.


Una implementación del lado del cliente podría realizarse utilizando el script BrowserDetect y filtrar las propiedades del navegador del usuario con esta lista: ¿Puedo usar: URI?

var browser = BrowserDetect.browser; var browserVersion = parseInt(BrowserDetect.version); var supportsURI = true; if((browser == ''Firefox'' && browserVersion < 2) || (browser == ''Explorer'' && browserVersion < 8) || (...)) { supportsURI = false; }

(no probado)

Si el navegador no admite los Esquemas URI, puede activar el enlace y mostrar una caja de luz que contenga los datos necesarios (por ejemplo, el número de teléfono).


DeviceAtlas y Wurfl pueden proporcionarle parte de esta información, pero como muchos han señalado, realmente no existe una manera realmente confiable de detectar la capacidad de un dispositivo para realizar una llamada. Después de todo, alguien podría estar en el escritorio, pero ser capaz de realizar una llamada desde él en función del software que haya instalado (o incluso de las capacidades de su sistema operativo).

Con el fin de proporcionar la mejor experiencia, debe incluir tel: links. Eso le dará a todos la oportunidad de marcar el número si pueden manejarlo. Podría usar CSS para hacer que se vea menos como un enlace para reducir la confusión potencial para no tel: soporte de navegadores / sistemas operativos. Los usuarios que quieran llamar al número lo seleccionarán o lo tocarán de todos modos (con la esperanza de copiar el número) y activarán el enlace (en escenarios táctiles) o verán la mano (en escenarios de mouse), ayudándolos a alcanzar su objetivo más rápidamente. .

Dejando de lado, establecer white-space: nowrap en tel: links también es una buena idea :-) Eso mantendrá los números en una sola línea para que los guiones no lo dejen.

a[href^=tel:] { white-space: nowrap; }