<a href="tel:...">在移動和非移動瀏覽器中使用</a>

Question

我需要為移動設備構建一個網頁。

只有一件事我還沒有弄清楚：如何通過單擊圖像來觸發電話。

如果我給一個<a href="tel:xxx-xxx"> ，它會工作，但如果從非移動瀏覽器點擊它，“找不到頁面”會出現，因為電話號碼自然不是現有頁面。

Answer 1

在瀏覽器中你測試過嗎？ 我已經在Firefox，Chrome和IE中嘗試過了，所有人都問我應該使用哪些軟件用於“tel”鏈接，他們都沒有給我一個錯誤頁面。

因為這個事實，我決定讓我上次制作的網站在移動和桌面瀏覽器中擁有電話鏈接。 有些用戶可能會使用手機軟件，因此點擊通話對桌面瀏覽器也有好處。

（這個答案應該是評論，但我的聲譽很低）

Answer 2

你可以這樣試試：

var isMobile = {
    Android: function() {
        return navigator.userAgent.match(/Android/i);
    },
    BlackBerry: function() {
        return navigator.userAgent.match(/BlackBerry/i);
    },
    iOS: function() {
        return navigator.userAgent.match(/iPhone|iPad|iPod/i);
    },
    Opera: function() {
        return navigator.userAgent.match(/Opera Mini/i);
    },
    Windows: function() {
        return navigator.userAgent.match(/IEMobile/i);
    },
    any: function() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
    }
};

讓jQuery為你做剩下的事情：

if( isMobile.any() ){
    $('a').attr('href', 'tel:1323456458897');
}

邊注：

要指定哪個<a>應該受到影響，請為您的<a>指定ID，並按以下方式執行操作：

 if (isMobile.any()) {
    $('a#phonea').attr('href', 'tel: 4515715151456');
 }

我這樣使用它，當不在移動設備上時禁用完整的鏈接:(在我的情況下，id電話是<li>元素

else {
    $('#phone').html('<i class="fa fa-phone"></i> Phone: 4515415411818');
}

我設置了一個小小提琴按鈕顯示： http ： //jsfiddle.net/rp8ma5oe/

Answer 3

它正在工作，就我而言，問題可能出在緩存中

Answer 4

它很簡單：把你的鏈接放在下面：

<a href="tel:12345565444">something or your number</a>