4

What's the appropriate way of a "link follow" event?

<a href="#" class="link">link</a>
<script>$('.link').on('click', function() { });</script>

Capturing the click event is not enough, because you can follow the link also by using double click or hitting the enter key.

Instead of wrapping each possible event, is there a ready-to-go function like on('follow')?

Daniel W.
  • 31,164
  • 13
  • 93
  • 151
  • 2
    The `click` event fires even if the link was activated by keypress: See here: http://jsfiddle.net/Le4pd48s/, the link is focused by default simply press enter to see the event hook working. – Rory McCrossan Dec 03 '15 at 10:19
  • So in which case are you encountering issue binding click event? – A. Wolff Dec 03 '15 at 10:21
  • 1
    There's no such event, and it's not possible to reliably know if a link was followed by using one of the many ways to open a link (right click, left click, control click, etc. etc.) – adeneo Dec 03 '15 at 10:21
  • Note that if you want to execute a function on click *or* double click you'll have to programmatically distinguish very well between them. If you don't, double click will merely be seen as two subsequent click events, which will in turn call the click event twice. – Bram Vanroy Dec 03 '15 at 10:22
  • 1
    @adeneo Ya the hard way seems to handle link followed through the context menu **and** accesskey – A. Wolff Dec 03 '15 at 10:22
  • 1
    You should edit your question because both of your examples `double click or hitting the enter key` are wrong, both fire the click event – A. Wolff Dec 03 '15 at 10:30
  • what is the purpose to follow? i don't get it guys can anyone update me on it. **is it like navigating away?** – Jai Dec 03 '15 at 10:32
  • 1
    @Jai If an user e.g use contextmenu on anchor to follow a link, OP wants to get an event fired, i guess... `contextmenu` wouldn't be enough in this case because user could still not follow link – A. Wolff Dec 03 '15 at 10:34
  • you can see if the key used was mouse or enter, for example.. http://jsfiddle.net/v2wvF/ – Shakawkaw Dec 03 '15 at 10:35
  • Thanks for this ton of feedback, I wasn't aware that `click` event gets fired even when using enter key to follow a link! – Daniel W. Dec 03 '15 at 10:55

1 Answers1

0

You can solve your problem using a semaphore. The semaphore should turn to green after a certain amount of time, say, 100 milliseconds. Let's suppose you have a function like this:

function onFollow(params) {
    //do something
}

Let's suppose further that you have an initialization, like

var semaphore = true;
var time = 100; //for example

You need to have a function like this:

function invalidEvent(e) {
    semaphore = false;
    setTimeout(function() {
        semaphore = true;
    }, time);
}

Let's have something like this:

$('.link').on('click', function(e) {
    //initialize params and maybe call e.preventDefault
    setTimeout(function() {
        if (semaphore) {
            onFollow(params);
        }
    }, time);
});
Lajos Arpad
  • 64,414
  • 37
  • 100
  • 175
  • I don't understand what it is supposed to handle here. I guess i get the logic but won't handle link followed when this doesn't fire click event – A. Wolff Dec 03 '15 at 10:28
  • 1
    Neither do I, this just captures a regular click, and if the link is followed the regular way, by redirecting, the timeout never fires. – adeneo Dec 03 '15 at 10:29
  • The other handles set the semaphore to false in a short while if they run. If they do not run, then semaphore stays green. Other handles will turn red in a short while. I have suggested e.preventDefault() in a comment. – Lajos Arpad Dec 03 '15 at 10:30