Question

我有一个带有href="tel:XXXXXXXXX"的标签，并且需要捕获点击事件。

我已经在chrome上测试了以下代码：$(document).on('click',console.log)。如果我单击此标签浏览器，它将调用该应用程序，但不会触发click事件。

$("a[href^='tel']").on('click', console.log);

这是有效的，但是我对ajax的内容加载有问题。我的代码已加载页面，一段时间后应用程序通过ajax添加了内容。当我使用$(document).on('click', ("a[href^='tel']", console.log)时出现问题。

Answer 1

$("a[href^='tel']").on("click", function(e){
    e.preventDefault(); e.stopPropagation();
    console.log(this);
    alert(this.getAttribute("href"));
})

//or if you want to delegate your function
$(document).on('click', "a[href^='tel']", function(e){
    e.preventDefault(); e.stopPropagation();
    console.log(this);
    alert(this.getAttribute("href"));
});

这会将事件侦听器绑定到具有a属性的href标签上的所有点击，并阻止点击本身。单击之后，您将能够使用控制台查看单击了哪个元素以及使用了什么href。

Answer 2

我认为这会有所帮助

$("a").click(function(e) {
    e.preventDefault();
    alert('clicked');  
    window.location.href = 'tel:+496170961709';
});

Answer 3

好的，我找到了解决方法。我使用较早的事件“ mousedown”，并将attr“ href”更改为“ only number”以禁用操作单击。

代码：

Select * from dbo.Exclusion_Process_Tab1_20190104

Answer 4

点击后，将从a标记中获取电话号码，其起始值为tel。

$("a[href^='tel']").on("click", function(e) {  
    var hrefText = this.getAttribute("href");
    var str = hrefText;
    var res = str.split(":");
    alert(res[1]);
});

Answer 5

在初始加载时

我首先建议您在将任何事件绑定到元素之前等待初始的DOM to be ready。

// DOM ready shorthand
$(function() {
  $("a[href^='tel']").on('click', function(e) {  
    // Do work here
  });
});

AJAX内容

如果要在初始加载后添加其他元素，则还必须将事件绑定到那些新元素。

您还可以执行类似的操作，例如将数据属性添加到绑定了单击事件的元素上，然后仅添加到尚未具有该数据属性的元素上-但这是额外的不必要的工作。

完整示例代码

// DOM Ready Shorthand
$(function() {
  // Click Handler
  function clickEvent(e) {
    // Do work here
  }

  // Bind click event to initial tels
  $("a[href^='tel']").on('click', clickEvent);

  // Arbitrary AJAX request for demonstration (wherever yours may be)
  $.ajax('/newContent')
    .done(function(html) {
      // Adding our response HTML to the page within #someElement
      $('#someElement').append(html);
      // Bind click event to the new tel elements scoped to the returned html
      $("a[href^='tel']", html).on('click', clickEvent);
    });
});

EventListener无法与锚tel：XXXXXXXXX

5 个答案:

在初始加载时

AJAX内容

完整示例代码