0

I have a script that differentiate single and double left clicks. Whereas dbl click is successfully detected and the assigned function is triggered upon event, single clicks are detected successfully but the assigned function is repeated infinitely upon event.

I have changed the original script for event delegation for I need dynamically generated DOM elements to respond with same functions to those events. After this change single click triggers the function assigned endlessly.

    //single and double clicks

jQuery.fn.single_double_click = function(single_click_callback, double_click_callback, timeout) {
  return this.each(function(){
    var clicks = 0, self = this;

    //delegated one:
    jQuery('#subunitscontainer').on('click', jQuery(this), function(event){
        
    //non delegated one:
    //single click has no problem but dynamically generated dom
    //does not response to the event here.
    //jQuery(this).click(function(event){
      clicks++;
      if (clicks == 1) {
        setTimeout(function(){
          if(clicks == 1) {
            single_click_callback.call(self, event);
          } else {
            double_click_callback.call(self, event);
          }
          clicks = 0;
        }, timeout || 300);
      }
    });
  });
}
//end single and double clicks

jsfiddle for it

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
sçuçu
  • 2,960
  • 2
  • 33
  • 60
  • Since you're using JQuery, I would like to point out that JQuery does have a [double-click](http://api.jquery.com/dblclick/) function. Also interesting is that JQuery suggests not adding the single click and double-click event handlers on the same object for some very good reasons. What problem are you trying to solve? – Serendipity May 06 '14 at 15:00
  • i am trying to query database on single click for months or days of months and fetch related content, and trying to go through smaller units, to days, on double click on bigger units, month names. and also on double r-click reverse this behaviour. – sçuçu May 06 '14 at 15:05
  • You are not delegating event here `jQuery('#subunitscontainer').on('click', jQuery(this), function(event){...});` The selector parameter only accepts a string, not a jQuery object. Here, you are binding click event to `#subunitscontainer` element as many times as you have matched elements passed to your jQuery function – A. Wolff May 06 '14 at 15:07
  • 1
    There is a working script on StackOverflow: http://stackoverflow.com/a/7845282/1948211 – dschu May 06 '14 at 15:11
  • possible duplicate of [Jquery bind double click and single click separately](http://stackoverflow.com/questions/6330431/jquery-bind-double-click-and-single-click-separately) – dschu May 06 '14 at 15:11
  • See there what i meant, with only one element matching selector `$('.days')`, alert() is fired only once: http://jsfiddle.net/a6GVr/3/ – A. Wolff May 06 '14 at 15:13
  • @dschazam i have looked that working script. it is ok except it does not work when the dynamically generated dom elements are clicked or dbl clicked. that is the second part i try to achieve. – sçuçu May 06 '14 at 15:39
  • @A. Wolff your fiddle seems not working. – sçuçu May 06 '14 at 15:41
  • i have changed it and it now works in my way. as this `$("#subunitscontainer").on("click", "p", function(e){` from `$("p").on("click", function(e){` anything buggy or kludgy. [jsfiddle](http://jsfiddle.net/farukscan/a6GVr/4/) – sçuçu May 06 '14 at 15:45

0 Answers0