在點擊事件中插入鏈接

我有一個腳本，用戶點擊「給我們打電話」，出現號碼併發送GA事件。在點擊事件中插入鏈接

是否有可能將號碼鏈接到電話號碼 - 鏈接，以便您可以撥打移動電話號碼？

我試着插入一個ID，但是這個號碼不能在手機上點擊。

感謝您的任何答案， DAV

這是腳本：

function ipTrackButton(){ 
    if(window.jQuery){ 
     var $ = jQuery; 

     var phonenumber = '+31 (0)20 - 679 62 22', 
      holder = $('#text-5 > .textwidget'), 
      newHTML = 'T: <span id="ipCallButton">Bel ons | Call us</span><br>E: <a href="mailto:[email protected]">[email protected]</a>', 
      body = $('body'); 

     //Inject styles 
     var style = '#ipCallButton { background-color:#eaeaea;padding:5px 8px;cursor:pointer;text-decoration:underline; } #ipCallButton.ipClicked { text-decoration:none;cursor:default; } '; 

     body.append('<style>'+style+'</style>'); 

     //Set new content 
     holder.html(newHTML); 

     //Set event 
     body.on('click', '#ipCallButton:not(.ipClicked)', function(){ 
      var _this = $(this); 
      _this.html(phonenumber); 
      _this.addClass('ipClicked'); 

      //Send event 
      ga('send', 'event', 'Contact', 'Click', 'Telefoonnummer'); 
     }); 
    } 
    else { 
     setTimeout(ipTrackButton, 50); 
    } 
} 

ipTrackButton();

來源

2017-08-31 dav isra

你的代碼的問題是，在任何時候你創建一個<a href="tel:...">元素。你所要做的就是將元素的innerHTML設置爲不可點擊的電話號碼。

你必須真正插入<a>元素：

body.on('click', '#ipCallButton:not(.ipClicked)', function(){ 
    var _this = $(this); 
    _this.append($('<a href="tel:' + phonenumber + '">' + phonenumber + '</a>')); 
    _this.addClass('ipClicked'); 
    //Send event 
    ga('send', 'event', 'Contact', 'Click', 'Telefoonnummer'); 
});

說實話，我認爲一個更好的解決辦法是直接添加<a>在HTML和CSS與隱藏，直到點擊。你並不真正需要的JavaScript的大部分時間你在做什麼：

function ipTrackButton(){ 
 
    if(window.jQuery){ 
 
     var $ = jQuery; 
 
     var body = $('body'); 
 

 
     //Set event 
 
     body.on('click', '#ipCallButton:not(.ipClicked)', function(){ 
 
      var _this = $(this); 
 
      _this.addClass('ipClicked'); 
 
      // removed: send ga event 
 
     }); 
 
    } 
 
    else { 
 
     setTimeout(ipTrackButton, 50); 
 
    } 
 
} 
 

 
ipTrackButton();

#ipCallButton:not(.ipClicked) .afterclick { 
 
    display: none; 
 
} 
 
#ipCallButton.ipClicked .beforeclick { 
 
    display: none; 
 
} 
 
/* copied */ 
 
#ipCallButton { background-color:#eaeaea;padding:5px 8px;cursor:pointer;text-decoration:underline; } #ipCallButton.ipClicked { text-decoration:none;cursor:default; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
T: <span id="ipCallButton"> 
 
    <span class="beforeclick">Bel ons | Call us</span> 
 
    <span class="afterclick"> 
 
     <a href="tel:+31 (0)20 - 679 62 22">+31 (0)20 - 679 62 22</a> 
 
</span><br> 
 
E: <a href="mailto:[email protected]">[email protected]</a>

來源

2017-08-31 22:16:16 amphetamachine

謝謝您的回答！不過，您的解決方案會在我的桌面版Chrome中同時顯示文字和數字;該數字是可點擊的。在我的iPhone上只顯示數字，但仍然不可點擊。您的其他解決方案看起來很有希望，但我希望修復當前的腳本。 –

@davisra剛試過在Chrome瀏覽器中剪下來，它適用於我。看起來您需要更好地瞭解爲什麼會發生這種情況，然後再嘗試整合我的解決方案。 – amphetamachine

在點擊事件中插入鏈接

回答

相關問題