Need to cancel click/mouseup events when double-click event detected

by

This is a good question, and I actually don’t think it can be done easily. (Some discussion on this)

If it is super duper important for you to have this functionality, you could hack it like so:

function singleClick(e) {
    // do something, "this" will be the DOM element
}

function doubleClick(e) {
    // do something, "this" will be the DOM element
}

$(selector).click(function(e) {
    var that = this;
    setTimeout(function() {
        var dblclick = parseInt($(that).data('double'), 10);
        if (dblclick > 0) {
            $(that).data('double', dblclick-1);
        } else {
            singleClick.call(that, e);
        }
    }, 300);
}).dblclick(function(e) {
    $(this).data('double', 2);
    doubleClick.call(this, e);
});

And here is an example of it at work.

As pointed out in the comments, there is a plugin for this that does what I did above pretty much, but packages it up for you so you don’t have to see the ugly: FixClick.

More Related Contents:

  1. jQuery .on() method doesn’t see new elements
  2. event.preventDefault() vs. return false
  3. How to debug JavaScript / jQuery event bindings with Firebug or similar tools?
  4. When should I use jQuery’s document.ready function?
  5. Can I call jQuery’s click() to follow an link if I haven’t bound an event handler to it with bind or click already?
  6. $(document).click() not working correctly on iPhone. jquery [duplicate]
  7. jQuery checkbox checked state changed event
  8. jQuery checkbox change and click event
  9. Why is this jQuery click function not working?
  10. Alternative to jQuery’s .toggle() method that supports eventData?
  11. jQuery equivalent of JavaScript’s addEventListener method
  12. What the difference between .click and .change on a checkbox [duplicate]
  13. jQuery click anywhere in the page except on 1 div
  14. jQuery: keyup event for mobile device
  15. jQuery: $().click(fn) vs. $().bind(‘click’,fn);
  16. Implementing jQuery’s “live” binder with native Javascript
  17. Difference between .click() and actually clicking a button? (javascript/jQuery)
  18. JavaScript: Invoking click-event of an anchor tag from javascript
  19. How to unbind a specific event handler
  20. jQuery: more than one handler for same event
  21. Jquery: mousedown effect (while left click is held down)
  22. submit event does not fire if submit initiated programmatically
  23. How to remove all click event handlers using jQuery?
  24. Programmatical click on -tag not working in Firefox
  25. Javascript click event handler – how do I get the reference to the clicked item?
  26. Cancel click event in the mouseup event handler
  27. Why isn’t my checkbox change event triggered?
  28. D3: How do I set “click” event and “dbclick” event at the same time?
  29. javascript click event handler fires without clicking
  30. Uncaught ReferenceError: Invalid left-hand side in assignment

Leave a Comment