Return false; When mouse hold(click) in x seconds

Question

My code is...

var timer;
var func = function () {
        $("body").append("1");
};

$(document).on('mousedown' , 'a' , function(e){
        timer = setTimeout(func, 1000);
}).on('mouseup mouseleave' , 'a' , function(e){
        clearTimeout(timer);
});

Everything working. But when I set this function to some link like <a href="http://google.com">text</a>

I need to set return false; (not redirect to the url or another onclick() functions)

Where return false; can I set in ? Or another solution ?

PS : And I will my link will work normally when click by normal clicking

Playground : http://jsbin.com/iwilop/1/edit

How can I listen for a click-and-hold in jQuery?

T.J. Crowder · Accepted Answer · 2013-02-27T10:51:25.177

2

You need to add a click handler and, if your func was called, prevent the default action of the click. Here I'm using timer as a flag:

var timer = 0;
var func = function () {
  $("body").append("1");
  timer = 0;
};

$(document).on('mousedown' , 'a' , function(e){
  timer = setTimeout(func, 1000);
}).on('mouseup mouseleave' , 'a' , function(e){
  if (timer) {
    clearTimeout(timer);
  }
}).on('click', 'a', function() {
  if (!timer) {
    return false;
  }
});

Updated JSBin

edited Feb 27 '13 at 10:51

answered Feb 27 '13 at 10:43

T.J. Crowder

1,031,962
187
1,923
1,875

for example in my `func` function ? – l2aelba Feb 27 '13 at 10:44
wouldn't `return false` in the `mousup` suffice? – Christoph Feb 27 '13 at 10:45
@l2aelba: No, you're trying to prevent the click, right? So prevent it on the link. – T.J. Crowder Feb 27 '13 at 10:45
Yes , But I will can click and redirect to the url when click normally too – l2aelba Feb 27 '13 at 10:46
@l2aelba: **sigh** You didn't *say* that. That changes things markedly. – T.J. Crowder Feb 27 '13 at 10:46
sorry man... edited my question : `PS : And I will my link will work normally when click by normal clicking` – l2aelba Feb 27 '13 at 10:48

score 0 · Answer 2 · edited May 23 '17 at 10:25

You need a click handler (you don't actually need to call return false unless there are other handlers that could also fire):

$(document).on('mousedown' , 'a' , function(e){
        timer = setTimeout(func, 1000);
}).on('mouseup mouseleave' , 'a' , function(e){
        clearTimeout(timer);
}).on('click', 'a', function(e) {
        return false;
});

Bear in mind that the above will affect all links on the page - you may need to qualify the a selector to be more specific (e.g. a.blah).

Edit: in light of your revised question, I have nothing to offer over and above T.J. Crowder's answer. The only thing I'd say is to watch out for global variables - you might want to wrap the whole thing in an immediately invoked function expression or similar.

edited my question : `PS : And I will my link will work normally when click by normal clicking` — l2aelba, Feb 27 '13 at 10:48

Return false; When mouse hold(click) in x seconds

2 Answers2