Afficher lien téléphone

Version imprimable

Bonjour,

J'ai un bouton "voir le numéro" qui affiche le numéro de téléphone lorsque l'on clique dessus. Cela fonctionne pour appeller depuis un smartphone mais avec le pc et ses différents navigateurs ça m'ouvre de nouvelles fenêtres avec comme message :

sous safari: ouvre même page sous chrome

sous internet explorer: voulez-vous que chrome ouvre ce programme "tel:0102030405"

sous opera: protocole inconnu opera n'a pas pu ouvrir le lien

etc...

J'ai bidouillé des codes trouvés sur le net que voici.

lien html avec bouton

Code:

1
2
<h3 class="p1">Accueil : <a class="telephone"> </a>
<a class="button-1" href="tel:0102030405"><span onclick="this.textContent=atob('MDEwMjAzMDQwNQ==');">Voir le numéro</span></a></h3>

fonction js

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
var isFirefox = (navigator.userAgent.toLowerCase().indexOf('firefox') > -1);
var isMobile = (typeof window.orientation !== "undefined") ||
               (navigator.userAgent.indexOf('IEMobile') !== -1);
 
if(isFirefox && !isMobile) {
    $('a[href^="tel:"]').click(function() { return false; });
} 
 
var isOpera = (navigator.userAgent.toLowerCase().indexOf('Opera') > -1);
var isMobile = (typeof window.orientation !== "undefined") ||
               (navigator.userAgent.indexOf('IEMobile') !== -1);
if(isOpera && !isMobile) {
    $('a[href^="tel:"]').click(function() { return false; });
} 
 
var isSafari = (navigator.userAgent.toLowerCase().indexOf('Safari') > -1);
var isMobile = (typeof window.orientation !== "undefined") ||
               (navigator.userAgent.indexOf('IEMobile') !== -1);
if(isSafari && !isMobile) {
    $('a[href^="tel:"]').click(function() { return false; });
} 
 
var isChrome = (navigator.userAgent.toLowerCase().indexOf('Chrome') > -1);
var isMobile = (typeof window.orientation !== "undefined") ||
               (navigator.userAgent.indexOf('IEMobile') !== -1);
if(isChrome && !isMobile) {
    $('a[href^="tel:"]').click(function() { return false; });
} 
 
var isIE = (navigator.userAgent.toLowerCase().indexOf('MSIE') > -1);
var isMobile = (typeof window.orientation !== "undefined") ||
               (navigator.userAgent.indexOf('IEMobile') !== -1);
if(isIE && !isMobile) {
    $('a[href^="tel:"]').click(function() { return false; });
}

MERCI.

Device detection (phone, tablet, desktop, mobile grade, os, versions) : http://hgoebl.github.io/mobile-detect.js/
Code:

1 2 3 4 5 6 7 var md = new MobileDetect( window.navigator.userAgent ); if ( md.mobile() === null ){ $( "a[href^='tel:']").on( "click", function( ){ return false; }); }

17/07/2015, 15h49
devillers

Bonjour Danielhagnoul,

Merci pour ta réponse, j'ai du mal à comprendre comment on insère le code dans la page. Est-ce que tu peux me décrire stp, comment procéder ?
Je n'y arrive pas.

Bonsoir,

C'est bon ça marche avec ce bout de code.

Code:

1
2
3
4
5
6
7
//Téléphone 
 
if (navigator.userAgent.match(/(android|iphone|blackberry|symbian|symbianos|symbos|netfront|model-orange|javaplatform|iemobile|windows phone|samsung|htc|opera mobile|opera mobi|opera mini|presto|huawei|blazer|bolt|doris|fennec|gobrowser|iris|maemo browser|mib|cldc|minimo|semc-browser|skyfire|teashark|teleca|uzard|uzardweb|meego|nokia|bb10|playbook)/gi)) {
    $('a[href^="tel:"]').click(function() { return true; });
} else {
    $('a[href^="tel:"]').click(function() { return false; });
}

19/07/2015, 11h19
danielhagnoul

:calim2:

Il suffisait de suivre le lien pour voir la documentation et charger le ZIP ou de copier-coller ce fichier : https://github.com/hgoebl/mobile-det...bile-detect.js
20/07/2015, 19h13
devillers

Merci pour le coup de main.