अस्थायी रूप से सभी वर्तमान में सक्रिय jQuery ईवेंट हैंडलर्स को निष्क्रिय

Question

मैं डबल क्लिक पर संपादन योग्य तालिका का एक TD तत्व बनाने हूँ:

$(document).on("dblclick", "#table>tbody>tr>td.cell", function(e) { 
    if (e.which != 1 || e.shiftKey || e.altKey || e.ctrlKey) 
     // need left button without keyboard modifiers 
     return; 
    reset_selection(); 
    var editor = document.createElement("div"); 
    editor.setAttribute("contenteditable", "true"); 
    editor.innerHTML = this.innerHTML; 
    this.innerHTML = ''; 
    // this.style.padding = 0; 
    this.appendChild(editor); 
    $(document).on("*", stub); 
    editor.onblur = function() { 
     // this.parentNode.setAttribute("style", ""); 
     this.parentNode.innerHTML = this.innerHTML; 
     sys.editor = null; 
     $(document).off("*", stub);; 
    }; 
    editor.focus(); 
}); 

function stub(e) { 
    e.stopImmediatePropagation(); 
    return false; 
} 

लेकिन जब मैं दोगुना संपादन योग्य div के अंदर का पाठ पर क्लिक करें, डबल क्लिक करें घटना के लिए प्रसारित माता-पिता टीडी अवांछित परिणाम पैदा कर रहा है। अन्य घटनाएं भी हैं (select, mousedown, आदि) मैं रोकना चाहता हूं, इसलिए उनमें से प्रत्येक के लिए एक स्टब लिखना मेरे लिए अच्छा नहीं लग रहा है।

सभी वर्तमान में सक्रिय jQuery ईवेंट हैंडलर्स को निष्क्रिय और उन्हें बाद में सक्षम करने के लिए कोई तरीका है? या किसी भी तरह से संपादन योग्य div से अपने माता-पिता को सभी घटनाओं का प्रचार करना बंद कर दें?

Answer 1

या किसी भी तरह संपादन योग्य से सभी घटनाओं का प्रचार करना बंद करो अपने माता-पिता को div?

यह बहुत स्वादिष्ट नहीं हो सकता है, लेकिन यह नहीं है कि बुरा विशेष रूप से घटनाओं को निष्क्रिय करने:

$(this).on("select mousedown mouseup dblclick etc", false); 

(। मान लिया जाये कि this सेल आप संपादित कर रहे हैं को संदर्भित करता है)

घटनाओं की सीमित संख्या है, और on आपको उन्हें स्पेस-सीमांकित स्ट्रिंग में सूचीबद्ध करने और false पास करके अक्षम करने की अनुमति देता है।

फिर आप उसी सूची और false को फिर से off में पार करके उन्हें पुनः सक्षम कर सकते हैं।

Answer 2

पर उपयोग/बंद JQuery तरीके:

var myFunction = function(e) { 
     if (e.which != 1 || e.shiftKey || e.altKey || e.ctrlKey) 
      // need left button without keyboard modifiers 
      return; 
     reset_selection(); 
     var editor = document.createElement("div"); 
     editor.setAttribute("contenteditable", "true"); 
     editor.innerHTML = this.innerHTML; 
     this.innerHTML = ''; 
     // this.style.padding = 0; 
     this.appendChild(editor); 
     $(document).on("*", stub); 
     editor.onblur = function() { 
      // this.parentNode.setAttribute("style", ""); 
      this.parentNode.innerHTML = this.innerHTML; 
      sys.editor = null; 
      $(document).off("*", stub);; 
     }; 
     editor.focus(); 
}; 

function stub(e) { 
    e.stopImmediatePropagation(); 
    return false; 
} 

//Active the events 
$(document).on("dblclick", "#table>tbody>tr>td.cell", myFunction); 

//Disable the events 
$(document).off("dblclick", "#table>tbody>tr>td.cell",myFunction); 

//Reactive the events 
$(document).on("dblclick", "#table>tbody>tr>td.cell", myFunction); 

अद्यतन

तुम भी अगर घटना को ध्यान में रखते नहीं किया जाना चाहिए true को एक चर सेट का प्रबंधन कर सकते हैं:

var skipEvent = true; 

$(document).on("dblclick", "#table>tbody>tr>td.cell", function (e) { 
    //Check variable and skip if true 
    if (skipEvent) 
     return false; 

    if (e.which != 1 || e.shiftKey || e.altKey || e.ctrlKey) 
    // need left button without keyboard modifiers 
    return; 
    reset_selection(); 
    var editor = document.createElement("div"); 
    editor.setAttribute("contenteditable", "true"); 
    editor.innerHTML = this.innerHTML; 
    this.innerHTML = ''; 
    // this.style.padding = 0; 
    this.appendChild(editor); 
    $(document).on("*", stub); 
    editor.onblur = function() { 
     // this.parentNode.setAttribute("style", ""); 
     this.parentNode.innerHTML = this.innerHTML; 
     sys.editor = null; 
     $(document).off("*", stub);; 
    }; 
    editor.focus(); 
});