Can JavaScript help prevent duplicate click event handling?

Question

I want the call function to run every 1.5 seconds. However, if you are clicking continuously on a mobile machine From the moment the call function is called in succession.

This is the code I am using:

$('#sendVideo').unbind('click');
$('#sendVideo').bind('click', function (event) {
    $("#sendVideo").prop("disabled", true);
    call();
    setTimeout("$('#sendVideo').prop('disabled', false);", 1500);
});

Is there a solution for this?

mehulmpt · Accepted Answer · 2017-02-06 05:50:19Z

3

You can use a clever hack:

var clickInProgress = false;
$('#sendVideo').bind('click', function (event) {
    if(clickInProgress) return;
    clickInProgress = true;
    $("#sendVideo").prop("disabled", true);
    call();
    setTimeout("$('#sendVideo').prop('disabled', false); clickInProgress=false;", 1500);
});

answered Feb 6, 2017 at 5:50

mehulmpt

16.7k13 gold badges54 silver badges90 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

vp_arth Over a year ago

it's can be nice idea to use disabled prop as this status

jichae Over a year ago

The value of clickInProgress does not change in setTimeout ("$ ('# sendVideo'). Prop ('disabled', false);

Siddharth Tyagi · Accepted Answer · 2017-02-06 06:02:19Z

0

You can set a flag on the element during the capture phase and delete it during bubble phase. I am not sure about jQuery but in simple java-script you can achieve it like this:

// set the flag on at capture
document.querySelector("#sendVideo").addEventListener('click', function(e) {
    if (this.flagOn) {
        e.preventDefault();
        return false;
    }
    this.flagOn = true;
    return true;
}, true);
// delete on bubble
document.querySelector("#sendVideo").addEventListener('click', function(e) {
    delete this.flagOn;
}, false);

This should handle that for you without any modification in your own code.

answered Feb 6, 2017 at 6:02

Siddharth Tyagi

4153 silver badges8 bronze badges

Collectives™ on Stack Overflow

Can JavaScript help prevent duplicate click event handling?

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related