सिंगल क्लिक इवेंट और डबल क्लिक इवेंट में अंतर कैसे करें?

Question

मेरे पास आईडी वाला एक बटन है "my_id"। मैंने इस तत्व के साथ दो jQuery की घटनाओं को जोड़ा

1।

$("#my_id").click(function() { 
    alert('single click');
});

2।

$("#my_id").dblclick(function() {
    alert('double click');
});

लेकिन हर बार यह मुझे देता है single click

Comments

सिंगल क्लिक को हमेशा फायर करना होगा, यह जानना असंभव है कि क्या डबल क्लिक होने वाला है जब तक कि यह वास्तव में निर्दिष्ट डबल क्लिक समय के भीतर न हो।

— पीटर जर्मिश्यूज

यह संभव है, मेरे उत्तर की जाँच करें। आपको पहले क्लिक के बाद कुछ एमएस इंतजार करना होगा और जांचना होगा कि निर्दिष्ट समय तक कोई नया क्लिक है या नहीं। इस तरह, आप जान सकते हैं कि क्या यह सिर्फ एक साधारण या एक डबल क्लिक है।

— एड्रिन शुलर

Answer 1

पहले क्लिक के बाद एक और क्लिक है या नहीं, यह जांचने के लिए आपको टाइमआउट का उपयोग करने की आवश्यकता है।

यहाँ चाल है :

// Author:  Jacek Becela
// Source:  http://gist.github.com/399624
// License: MIT

jQuery.fn.single_double_click = function(single_click_callback, double_click_callback, timeout) {
  return this.each(function(){
    var clicks = 0, self = this;
    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);
      }
    });
  });
}

उपयोग:

$("button").single_double_click(function () {
  alert("Try double-clicking me!")
}, function () {
  alert("Double click detected, I'm hiding")
  $(this).hide()
})

<button>Click Me!</button>

संपादित करें:

जैसा कि नीचे कहा गया है, मूल dblclickघटना का उपयोग करना पसंद करते हैं : http://www.quirksmode.org/dom/events/click.html

या jQuery द्वारा प्रदान किया गया: http://api.jquery.com/dblclick/

Comments

यह सामान्य रूप से अच्छी तरह से काम करने के लिए लग सकता है, लेकिन क्लिकों के बीच अंतराल समय की अनुमति नहीं है (जिसके द्वारा दो क्लिकों की व्याख्या डबल-क्लिक के रूप में की जाती है) सिस्टम कॉन्फ़िगरेशन द्वारा भिन्न होती है? यह शायद इस dblclickघटना पर भरोसा करने के लिए सुरक्षित है

— जॉन Z

हाँ, मुझे लगता है कि तुम सही हो, dblclickनिश्चित रूप से आज जाने का रास्ता है। jQuery भी इस घटना को संभालता है: api.jquery.com/dblclick

— एड्रियन शूलर

@ AdrienSchuler - डॉक से आप लिंक करते हैं: एक ही तत्व के लिए क्लिक और डब्लक्लिक घटनाओं दोनों के लिए हैंडलर को बांधना अनुचित है। सवाल दोनों के होने का है ।

— अल्वारो गोंजालेज

जब event.detailउपलब्ध है, तो यह क्लिक हैंडलर से डबल-क्लिक का पता लगाने का सबसे अच्छा तरीका है। इस जवाब को देखें ।

— कार्ल जी

अच्छा समाधान एड्रियन, मुझे इसकी आवश्यकता है ऐसे मामले के लिए जहां हमारे पास एक ऑब्जेक्ट पर एक सिंगल और डबल क्लिक इवेंट है और बस एक को निकाल दिया जाना चाहिए। इसलिए आपका समाधान मेरे लिए एकदम सही है। मैंने इसे नियंत्रण में "इसे" प्राप्त करने के लिए थोड़ा सुधार किया: playcode.io/492022

— LOstBrOkenKeY

Answer 2

dblclickघटना के व्यवहार को क्विरक्समोड में समझाया गया है ।

एक के लिए घटनाओं का क्रम dblclickहै:

1. माउस नीचे
2. mouseup
3. क्लिक
4. माउस नीचे
5. mouseup
6. क्लिक
7. dblclick

इस नियम का अपवाद (निश्चित रूप से) इंटरनेट एक्सप्लोरर उनके कस्टम ऑर्डर के साथ है:

1. माउस नीचे
2. mouseup
3. क्लिक
4. mouseup
5. dblclick

जैसा कि आप देख सकते हैं, एक ही तत्व पर दोनों घटनाओं को एक साथ सुनने से आपके clickहैंडलर को अतिरिक्त कॉल मिलेगा ।

Comments

यकीन नहीं है कि dblclickयह भी विश्वसनीय है ... यदि मैं एक बार क्लिक करता हूं ... एक या दो सेकंड प्रतीक्षा करें, तो फिर से क्लिक करें, मुझे dblclickदूसरी क्लिक पर एक घटना मिलती है !

— माइकल

फ़ाइलों के नाम बदलने के लिए ऐसे लंबे क्लिक उपयोगी हैं। अगर इसे अलग करने के लिए 'लॉन्गक्लिक' जैसे पैरामीटर हों तो अच्छा होगा।

— पीटरएम

जब event.detailउपलब्ध है, तो यह क्लिक हैंडलर से डबल-क्लिक का पता लगाने का सबसे अच्छा तरीका है। इस जवाब को देखें ।

— कार्ल जी

Answer 3

अधिक तदर्थ राज्यों और सेटटाइमआउट का उपयोग करने के बजाय, यह पता चलता है कि एक मूल संपत्ति है जिसे detailआप eventऑब्जेक्ट से एक्सेस कर सकते हैं !

element.onclick = event => {
   if (event.detail === 1) {
     // it was a single click
   } else if (event.detail === 2) {
     // it was a double click
   }
};

आधुनिक ब्राउज़र और यहां तक ​​कि IE-9 इसका समर्थन करता है :)

स्रोत: https://developer.mozilla.org/en-US/docs/Web/API/UIEvent/detail

Comments

सबसे अच्छा जवाब :)

— sk8terboi87 '

डबल क्लिक के मामले में, एक सिंगल क्लिक (जहां event.detail === 1) अभी भी ट्रिगर होगा। मेरी देखें बेला या इस सूत्र पर यह टिप्पणी ।

— फबिएन स्नूवर्ट

अच्छी बात @FabienSnauwaert। मुझे लगता है कि हम एक विशेष तत्व पर सिंगल और डबल क्लिक इवेंट हैंडलर दोनों को बांध नहीं सकते हैं; उपरोक्त विधि टाइमर की तरह सामान का सहारा लिए बिना एक डबल क्लिक निश्चित रूप से निर्धारित करने के लिए उपयोगी है।

— kyw

आप अभी भी एक टाइमर की जरूरत है कि पहले आग नहीं करने के लिए क्लिक करें। नीचे दिए गए मेरे जवाब की जांच करें stackoverflow.com/questions/5497073/…

बस एक एक्सेसिबिलिटी नोट: यदि एक क्लिक इवेंट को कीबोर्ड से निकाल दिया जाता है (उदाहरण के लिए, जब कोई उपयोगकर्ता एक बटन को फोकस करने और एंटर प्रेस करने के लिए टैब करता है), तो इवेंट को 0 के रूप में डिटेल प्रॉपर्टी के साथ जेनरेट किया जाता है, इसलिए कुछ ऐसा करना जिससे if(evt.detail !== 1) return;आकस्मिक डबल रिजेक्ट हो जाए क्लिक बिना माउस के उपयोगकर्ताओं के लिए उस बटन तक पहुंच को रोक देगा।

— gristow

Answer 4

एक साधारण कार्य। किसी भी प्रकार की जीत या अन्य ढांचे की आवश्यकता नहीं है। अपने कार्यों को मापदंडों के रूप में पास करें

<div onclick="doubleclick(this, function(){alert('single')}, function(){alert('double')})">click me</div>
    <script>
        function doubleclick(el, onsingle, ondouble) {
            if (el.getAttribute("data-dblclick") == null) {
                el.setAttribute("data-dblclick", 1);
                setTimeout(function () {
                    if (el.getAttribute("data-dblclick") == 1) {
                        onsingle();
                    }
                    el.removeAttribute("data-dblclick");
                }, 300);
            } else {
                el.removeAttribute("data-dblclick");
                ondouble();
            }
        }
    </script>

Comments

मुझे लगता है कि यह सबसे अच्छा उत्तर होना चाहिए। फिर भी, मुझे विंडोज IE8 पर काम करने के लिए समय सीमा 200 तक कम करनी पड़ी, लेकिन यह मान OS और उपयोगकर्ता पर निर्भर हो सकता है। और एक डबल क्लिक पंजीकृत होने पर क्लिक के निष्पादन को रद्द करने में सक्षम होने के लिए टाइमर संदर्भ को भी बचाया।

— xpereta

कोड के इस टुकड़े के लिए धन्यवाद, यह क्रोम और फ़ायरफ़ॉक्स पर बहुत अच्छा काम करता है (हालांकि क्रोम को डीबीएल और सिंगल के साथ काम करने के लिए इस हैक की आवश्यकता नहीं है)।

— विजेता

का उपयोग el.dataset.dblclickकरना अब ऐसा करने का एक अच्छा तरीका होगा।

— फ़िक्स

जब event.detailउपलब्ध है, तो यह क्लिक हैंडलर से डबल-क्लिक का पता लगाने का सबसे अच्छा तरीका है। इस जवाब को देखें ।

— कार्ल जी

Answer 5

मुझे डर है कि व्यवहार ब्राउज़र पर निर्भर है:

एक ही तत्व के लिए क्लिक और डब्क्लिक घटनाओं दोनों के लिए हैंडलर को बांधना अनुचित है। ट्रिगर की गई घटनाओं का क्रम ब्राउज़र से ब्राउज़र तक भिन्न होता है, कुछ के साथ दो क्लिक करने से पहले की घटनाएँ प्राप्त होती हैं और अन्य केवल एक। डबल-क्लिक संवेदनशीलता (डबल क्लिक के रूप में पहचाने जाने वाले क्लिकों के बीच अधिकतम समय) ऑपरेटिंग सिस्टम और ब्राउज़र द्वारा भिन्न हो सकती है, और अक्सर उपयोगकर्ता-कॉन्फ़िगर योग्य है।

http://api.jquery.com/dblclick/

फ़ायरफ़ॉक्स में अपना कोड चलाना, click()हैंडलर में अलर्ट () आपको दूसरी बार क्लिक करने से रोकता है। यदि आप ऐसे अलर्ट को हटाते हैं, तो आपको दोनों ईवेंट मिलते हैं।

Comments

जब event.detailउपलब्ध है, तो यह क्लिक हैंडलर से डबल-क्लिक का पता लगाने का सबसे अच्छा तरीका है। इस जवाब को देखें ।

— कार्ल जी

Answer 6

खैर डबल क्लिक करने के लिए (दो बार क्लिक करें) आपको पहले एक बार क्लिक करना होगा। click()अपना पहला क्लिक पर हैंडलर की आग, और के बाद से चेतावनी पॉप अप होता है, आप आग दूसरे क्लिक बनाने का मौका नहीं हैdblclick() हैंडलर।

अपने हैंडलर बदलें एक के अलावा कुछ करने के लिए alert()और आप व्यवहार देखेंगे। (शायद तत्व का पृष्ठभूमि रंग बदलें):

$("#my_id").click(function() { 
    $(this).css('backgroundColor', 'red')
});

$("#my_id").dblclick(function() {
    $(this).css('backgroundColor', 'green')
});

Answer 7

यह उत्तर समय के माध्यम से अप्रचलित हो जाता है, @ kyw के समाधान की जाँच करें।

मैंने @AdrienSchuler द्वारा पोस्ट किए गए जिस्ट से प्रेरित एक समाधान बनाया। इस समाधान का उपयोग केवल तब करें जब आप एक क्लिक और एक तत्व पर डबल क्लिक करना चाहते हैं। अन्यथा मैं देशी clickऔर dblclickश्रोताओं का उपयोग करने की सलाह देता हूं ।

ये अंतर हैं:

• वनिलज, कोई निर्भरता नहीं
• setTimeoutक्लिक या डबल क्लिक हैंडलर को संभालने के लिए प्रतीक्षा न करें
• जब डबल क्लिक करने से यह पहली बार क्लिक हैंडलर को फायर करता है, तो डबल क्लिक हैंडलर को

जावास्क्रिप्ट:

function makeDoubleClick(doubleClickCallback, singleClickCallback) {
    var clicks = 0, timeout;
    return function() {
        clicks++;
        if (clicks == 1) {
            singleClickCallback && singleClickCallback.apply(this, arguments);
            timeout = setTimeout(function() { clicks = 0; }, 400);
        } else {
            timeout && clearTimeout(timeout);
            doubleClickCallback && doubleClickCallback.apply(this, arguments);
            clicks = 0;
        }
    };
}

उपयोग:

var singleClick = function(){ console.log('single click') };
var doubleClick = function(){ console.log('double click') };
element.addEventListener('click', makeDoubleClick(doubleClick, singleClick));

नीचे एक jsfiddle में उपयोग किया जाता है, jQuery बटन स्वीकृत उत्तर का व्यवहार है।

jsfiddle

Comments

उपरोक्त कोड और आपकी

— फ़ेल्ड

@ जूम यह अभी भी हर ब्राउज़र में मेरे लिए ट्रिक करता है। क्या "काम नहीं करता है" और आप क्या उम्मीद करते हैं? ऐसा लगता है कि आपका संस्करण वह नहीं है जो मैंने इरादा किया था।

— A1rPun

मुट्ठी मैंने अपना संस्करण संशोधित किया है (डबल क्लोजर हटा दिया गया है), कृपया नया प्रयास करें: jsfiddle.net/jeum/cpbwx5vr/20 आपके फ़िडेल (वेनिला संस्करण) के साथ समस्या यह है कि सिंगल-हैंडलर को डबल-क्लिक करता है: यह एकल को पुनः प्राप्त करता है + मेरे लिए डबल।

— जेम

@ जेम वह एक त्रुटि देता है। हाँ, मेरा उत्तर यहाँ दिए गए और अन्य उत्तरों से भिन्न है और मैं इस पंक्ति में इस अंतर को भी निर्दिष्ट करता हूँ: एक क्लिक फायर करें, फिर एक डबलक्लिक (सीधे

— डबलक्लिक पर न जाएँ

हां त्रुटि फिर से, इसलिए यह संस्करण मुख्य प्रश्न का उत्तर देता है: jsfiddle.net/jeum/cpbwx5vr/21 । अब आपके संस्करण के बारे में (यह सच है कि मैं समझ नहीं पाया था), क्या आपने देखा है कि 'jQuery' आपके फिडल में वह नहीं हासिल करता है जो आप चाहते हैं?

— जेम

Answer 8

A1rPun उत्तर पर आधारित एक और सरल वनीला घोल ( jQuery समाधान के लिए उसकी फिडेल देखें , और दोनों इस एक में हैं ) के ।

ऐसा लगता है कि जब उपयोगकर्ता डबल-क्लिक करता है तो सिंगल-क्लिक हैंडलर को ट्रिगर नहीं करता है, देरी के बाद सिंगल-क्लिक हैंडलर आवश्यक रूप से चालू हो जाता है ...

var single = function(e){console.log('single')},
    double = function(e){console.log('double')};

var makeDoubleClick = function(e) {

  var clicks = 0,
      timeout;

  return function (e) {

    clicks++;

    if (clicks == 1) {
      timeout = setTimeout(function () {
        single(e);
        clicks = 0;
      }, 250);
    } else {
      clearTimeout(timeout);
      double(e);
      clicks = 0;
    }
  };
}
document.getElementById('btnVanilla').addEventListener('click', makeDoubleClick(), false);

Comments

यह वास्तव में सबसे अच्छा विकल्प है यदि आप सिंगल क्लिक नहीं चाहते हैं :)

— A1rPun

जब event.detailउपलब्ध है, तो यह क्लिक हैंडलर से डबल-क्लिक का पता लगाने का सबसे अच्छा तरीका है। इस जवाब को देखें ।

— कार्ल जी

Answer 9

घटनाओं की एक मनमानी संख्या के लिए जेम के कोड का एक विकल्प यहां दिया गया है:

 var multiClickHandler = function (handlers, delay) {
    var clicks = 0, timeout, delay = delay || 250;
    return function (e) {
      clicks++;
      clearTimeout(timeout);
      timeout = setTimeout(function () {
        if(handlers[clicks]) handlers[clicks](e);
        clicks = 0;
      }, delay);
    };
  }

  cy.on('click', 'node', multiClickHandler({
    1: function(e){console.log('single clicked ', e.cyTarget.id())},
    2: function(e){console.log('double clicked ', e.cyTarget.id())},
    3: function(e){console.log('triple clicked ', e.cyTarget.id())},
    4: function(e){console.log('quadro clicked ', e.cyTarget.id())},
    // ...
  }, 300));

यह एक cytoscape.js एप्लिकेशन के लिए आवश्यक है ।

Comments

अच्छा! हम लौटे फ़ंक्शन के अंदर एक नया वैरिएबल भी घोषित कर सकते हैं और इसके साथ असाइन कर सकते हैं this, जो कि क्लिक किया गया तत्व है, और इसे हैंडलर ( eइसके साथ या इसके बजाय) को पास कर दें।

— हेयूड

Answer 10

एक और एक ही तत्व पर सिंगल क्लिक और डबल क्लिक के बीच अंतर कैसे करें?

यदि आपको उन्हें मिश्रण करने की आवश्यकता नहीं है, तो आप पर clickऔर पर भरोसा कर सकते हैंdblclick और प्रत्येक ठीक काम करेगा।

उन्हें मिलाने की कोशिश करते समय एक समस्या उत्पन्न होती है: एक dblclickघटना वास्तव में एक clickघटना को भी ट्रिगर करेगी , इसलिए आपको यह निर्धारित करने की आवश्यकता है कि क्या एक सिंगल क्लिक "स्टैंड-अलोन" सिंगल क्लिक है, या एक डबल क्लिक का हिस्सा है।

इसके अलावा: आप दोनों का उपयोग नहीं करना चाहिए clickऔर dblclickएक और एक ही तत्व पर :

एक ही तत्व के लिए क्लिक और डब्क्लिक घटनाओं दोनों के लिए हैंडलर को बांधना अनुचित है। ट्रिगर की गई घटनाओं का क्रम ब्राउज़र से ब्राउज़र तक भिन्न होता है, कुछ के साथ दो क्लिक करने से पहले की घटनाएँ प्राप्त होती हैं और अन्य केवल एक। डबल-क्लिक संवेदनशीलता (डबल क्लिक के रूप में पहचाने जाने वाले क्लिकों के बीच अधिकतम समय) ऑपरेटिंग सिस्टम और ब्राउज़र द्वारा भिन्न हो सकती है, और अक्सर उपयोगकर्ता-कॉन्फ़िगर योग्य है।
स्रोत: https://api.jquery.com/dblclick/

अब अच्छी खबर पर:

आप ईवेंटdetail से संबंधित क्लिक की संख्या का पता लगाने के लिए ईवेंट की संपत्ति का उपयोग कर सकते हैं । यह अंदर डबल क्लिक करता हैclick पता लगाने के लिए काफी आसान के ।

समस्या एकल क्लिकों का पता लगाने की बनी हुई है और वे डबल क्लिक का हिस्सा हैं या नहीं। उसके लिए, हम एक टाइमर का उपयोग कर वापस आ रहे हैं औरsetTimeout ।

डेटा विशेषता के उपयोग (वैश्विक वैरिएबल से बचने के लिए) और स्वयं क्लिकों को गिनने की आवश्यकता के बिना, सभी को एक साथ लपेटकर, हम निम्नलिखित हैं:

HTML:

<div class="clickit" style="font-size: 200%; margin: 2em; padding: 0.25em; background: orange;">Double click me</div>

<div id="log" style="background: #efefef;"></div>

जावास्क्रिप्ट:

<script>
var clickTimeoutID;
$( document ).ready(function() {

    $( '.clickit' ).click( function( event ) {

        if ( event.originalEvent.detail === 1 ) {
            $( '#log' ).append( '(Event:) Single click event received.<br>' );

            /** Is this a true single click or it it a single click that's part of a double click?
             * The only way to find out is to wait it for either a specific amount of time or the `dblclick` event.
             **/
            clickTimeoutID = window.setTimeout(
                    function() {
                        $( '#log' ).append( 'USER BEHAVIOR: Single click detected.<br><br>' );
                    },
                    500 // how much time users have to perform the second click in a double click -- see accessibility note below.
                );

        } else if ( event.originalEvent.detail === 2 ) {
            $( '#log' ).append( '(Event:) Double click event received.<br>' );
            $( '#log' ).append( 'USER BEHAVIOR: Double click detected.<br>' );
            window.clearTimeout( clickTimeoutID ); // it's a dblclick, so cancel the single click behavior.
        } // triple, quadruple, etc. clicks are ignored.

    });

});
</script>

डेमो:

JSfiddle

---

पहुंच और डबल क्लिक गति के बारे में नोट्स:

• जैसा कि विकिपीडिया यह कहता है "दोहरे क्लिक के रूप में व्याख्या किए जाने के लिए लगातार दो क्लिक्स के लिए आवश्यक अधिकतम विलंब मानकीकृत नहीं है।"
• ब्राउज़र में सिस्टम की डबल-क्लिक गति का पता लगाने का कोई तरीका नहीं।
• लगता है कि डिफ़ॉल्ट 500 एमएस है और विंडोज पर 100-900mms की रेंज ( स्रोत )
• विकलांग लोगों के बारे में सोचें, जो अपने ओएस सेटिंग्स में, अपनी सबसे धीमी गति पर डबल क्लिक करते हैं।
  • यदि सिस्टम डबल क्लिक की गति हमारे डिफ़ॉल्ट 500 एमएस से अधिक धीमी है, तो एकल और डबल-क्लिक व्यवहार दोनों को ट्रिगर किया जाएगा।
  • या तो संयुक्त एकल पर भरोसा न करें और एक और एक ही आइटम पर डबल क्लिक करें।
  • या: मूल्य बढ़ाने की क्षमता रखने के लिए विकल्पों में एक सेटिंग जोड़ें।

---

एक संतोषजनक समाधान खोजने में थोड़ा समय लगा, मुझे आशा है कि इससे मदद मिलेगी!

Answer 11

उत्कृष्ट jQuery स्पार्कल प्लगइन का उपयोग करें। प्लगइन आपको पहले और अंतिम क्लिक का पता लगाने का विकल्प देता है। यदि आप पहले क्लिक के बाद एक और क्लिक करते हैं, तो यह पता लगाकर कि आप क्लिक और डब्लक्लिक के बीच अंतर कर सकते हैं।

Http://balupton.com/sandbox/jquery-sparkle/demo/ पर इसे देखें

Answer 12

मैंने एक साधारण jQuery प्लगइन लिखा है, जो आपको डबल क्लिक से एकल-क्लिक को अलग करने के लिए एक कस्टम 'सिंगलक्लिक' ईवेंट का उपयोग करने देता है:

https://github.com/omriyariv/jquery-singleclick

$('#someDiv').on('singleclick', function(e) {
    // The event will be fired with a small delay.
    console.log('This is certainly a single-click');
}

Answer 13

आधुनिक सही उत्तर स्वीकृत उत्तर और @kyw के समाधान के बीच का मिश्रण है। आपको उस पहले एकल क्लिक event.detailको रोकने के लिए और दूसरी क्लिक को रोकने के लिए चेकआउट की आवश्यकता है।

const button = document.getElementById('button')
let timer
button.addEventListener('click', event => {
  if (event.detail === 1) {
    timer = setTimeout(() => {
      console.log('click')
    }, 200)
  }
})
button.addEventListener('dblclick', event => {
  clearTimeout(timer)
  console.log('dblclick')
})

<button id="button">Click me</button>

Answer 14

मैं jquery (और अन्य 90-140k libs) से बचना पसंद करता हूं, और जैसा कि पहले उल्लेखित ब्राउज़र पहले से क्लिक करते हैं, इसलिए यहां मैंने जो वेबसाइट बनाई है, उस पर मैंने यह किया है (यह उदाहरण एक क्लिक की गई लोकल xy को कवर करता है)

clicksNow-0; //global js, owell

function notify2(e, right) {  // called from onclick= and oncontextmenu= (rc)
var x,y,xx,yy;
var ele = document.getElementById('wrap');  
    // offset fixed parent for local win x y
var xxx= ele.offsetLeft;
var yyy= ele.offsetTop;

//NScape
if (document.layers || document.getElementById&&!document.all) {
    xx= e.pageX;
    yy= e.pageY;
} else {
    xx= e.clientX;
    yy= e.clientY;
}
x=xx-xxx;
y=yy-yyy;

clicksNow++;
    // 200 (2/10ths a sec) is about a low as i seem to be able to go
setTimeout( "processClick( " + right + " , " + x + " , " + y + ")", 200);
}

function processClick(right, x, y) {
if (clicksNow==0) return; // already processed as dblclick
if (clicksNow==2) alert('dbl');
clicksNow=0;
    ... handle, etc ...
}

उम्मीद है की वो मदद करदे

Comments

आपके गेम का URL आपके उत्तर को समझने के लिए आवश्यक नहीं है। मैं इसे हटा रहा हूं ताकि इस पोस्ट को स्पैम के प्रयास के रूप में नहीं देखा जाए।

— एंड्रयू बार्बर

एकमात्र माइनस, 200 जादू निरंतर है और ओएस में उपयोगकर्ता की माउस सेटिंग्स से काफी भिन्न हो सकता है

— डेन्यूबियन नाविक

Answer 15

Datatables.net के लिए, एड्रियन शुलर के आधार पर (बहुत बहुत धन्यवाद !!!) जवाब और कई उपयोगों के लिए, यहाँ एक संशोधन है:

समारोह

/**
 * For handle click and single click in child's objects
 * @param {any} selector Parents selector, like 'tr'
 * @param {any} single_click_callback Callback for single click
 * @param {any} double_click_callback Callback for dblclick
 * @param {any} timeout Timeout, optional, 300 by default
 */
jQuery.fn.single_double_click = function (selector, single_click_callback, double_click_callback, timeout) {
    return this.each(function () {
        let clicks = 0;
        jQuery(this).on('click', selector, function (event) {
            let self = this;
            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);
            }
        });
    });
}

उपयोग

$("#MyTableId").single_double_click('tr',
            function () {   //  Click
                let row = MyTable.row(this);
                let id = row.id();
                let data = row.data();
                console.log("Click in "+id+" "+data);
            },
            function () {   //  DBLClick
                let row = MyTable.row(this);
                let id = row.id();
                let data = row.data();
                console.log("DBLClick in "+id+" "+data);
            }
        );

Answer 16

इसने मेरे लिए काम किया

var clicked=0;
function chkBtnClcked(evnt) {
    clicked++;
    // wait to see if dblclick
    if (clicked===1) {
        setTimeout(function() {
            clicked=0;
            .
            .
        }, 300); // test for another click within 300ms
    }
    if (clicked===2) {
        stopTimer=setInterval(function() {
            clicked=0;
            .
            .
        }, 30*1000); // refresh every 30 seconds
    }
}

usage-

<div id="cloneimages" style="position: fixed;" onclick="chkBtnClcked(evnt)"  title="Click for next pic; double-click for slide show"></div>

Answer 17

मूल एचटीएमएल उत्तर को सिर्फ पोस्ट करना आसान होने की स्थिति में और एचटीएमएल होना चाहिए।

<p ondblclick="myFunction()" id = 'id'>Double-click me</p>

इस पाठ्यक्रम में देशी जेकरी विकल्प हैं। अर्थात...$('#id').attr('ondblclick',function(){...}) या, जैसा कि पहले कहा गया है,$('#id').dblclick(function(){...});

Answer 18

मुझे पता है कि यह पुराना है, लेकिन नीचे एक जेएस केवल एक मूल लूप काउंटर का उदाहरण है जिसमें एकल बनाम दोहरी क्लिक का निर्धारण किया गया है। उम्मीद है कि यह किसी की मदद करता है।

var count = 0;
var ele = document.getElementById("my_id");
ele.addEventListener('click', handleSingleDoubleClick, false); 

function handleSingleDoubleClick()
{
  if(!count) setTimeout(TimerFcn, 400); // 400 ms click delay
  count += 1;
}
function TimerFcn() 
{
  if(count > 1) console.log('you double clicked!')
  else console.log('you single clicked')
  count = 0;
}