暫時禁用所有當前活動的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中的文本，則雙擊事件傳播到父母td造成不良後果。還有其他的事件（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(); 
});