带有tel的锚标记上的preventDefault无效：

Question

When a user clicks on a telephone number it should do nothing on desktop and on mobile it should call the number. I thought the solution would be as simple as returning false or preventDefault when on a desktop but so far it doesnt seem to work:

<a href="tel:555555">555-555</a>

I'm using mouseup() so that it only prevents it on desktop. The function runs but the browser still tries to open up another app.

$('a[href^="tel"]').mouseup(function (e) {
    e.preventDefault();
    return false;
})

Is there a solution as simple as this that actually works or is the best method to detect for mobile and change the href attributes as seen on other questions?

SOLUTION

Thanks to the answer below. mouseup() runs but can't preventDefault. This was the final code using modernizr:

$('a[href^="tel"]').on('click',function (e) {
    if ($("html").hasClass("no-touch")) {
        e.preventDefault();
    }
});

Answer 1

You could do this:

$('.no-touch a[href^="tel"]').on('click',function (e) {
    e.preventDefault();
});

If you need it to work on touch devices, and are using Modernizr (which it looks like) you could do this instead:

$('a[href^="tel"]').on('click',function (e) {

   if (!Modernizr.touch) {
       e.preventDefault();
   }

    ... my touch code ...
});

Answer 2

Try like

function callMethod(){
  //do stuff here
}
$('a[href^="tel"]').on('click',function (e) {
    e.preventDefault();
    callMethod();
})

$('a[href^="tel"]').on('touchstart',function (e) {
    callMethod();
})