在Chrome中刪除後代目標dom時仍然調用jQuery委託處理程序，而不是在Firefox中

Question

我發現Chrome中出現以下行爲，而不是Firefox中。

我有一個輸入元件，其

• 有「變化」的事件處理程序
• 已「的keydown」的事件處理程序，其中，當用戶類型退格鍵和元素的內容是沒有，則該元件是除去。
• 並且這兩個處理程序綁定到某個包裝元素，並且事件處理程序使用jQuery.on函數作爲委託處理程序附加。

在Chrome中，如果我

1）點擊輸入框，在輸入框中輸入一些文字，並集中了。

• 更改事件處理程序被調用。

2）單擊輸入框，鍵入退格鍵以刪除所有內容，然後再次鍵入以刪除該輸入框。

• 然後，改變事件處理程序仍然被調用，雖然目標輸入DOM被刪除！

在Firefox中，當箱由於去除退格的keydown，改變事件處理函數不是叫..

是隻在我的瀏覽器？或jQuery的錯誤？或瀏覽器執行錯誤？

我寫的jsfiddle簡化代碼.. http://jsfiddle.net/RbAua/6/

Answer 1

如果使用bind()上改變事件它按預期工作，

似乎錯誤有關on()方法，這就是爲什麼我不明白爲什麼最後一次所有使用.on（）甚至對於單個元素！

http://jsfiddle.net/RbAua/9/

$('#wrap').on('keydown','#input',function(event){ 
    if(event.keyCode == 8){ // backspace 
        if($(this).val().length == 0){ 
            $(this).remove(); 
            $('#txt').append('<div> removed! </div>'); 
            event.preventDefault(); 
        } 
    } 
}); 


$('#wrap #input').bind('change', function(){ 
    $('#txt').append('<div> changed! to [' + $(this).val() + '] </div>'); 
}); 

調試的jQuery，我發現，如果事件已應用於與（）或生活（），那麼，元件沒有緩存的事件數據，所以CleanData()不正常工作，在這種情況更令人奇怪的是，FF在預期範圍內運行正常。

我發現解決方法對於這個，想法是隻綁定到可見元素，所以在刪除之前使用 hide（）將防止更改火災。

var onchange = function(e) { 
    $('#txt').append('<div> changed! to [' + $(this).val() + '] </div>'); 
}; 

$('#wrap').on('keydown', '#input', function(event) { 
    if (event.keyCode == 8) { // backspace 
     if ($(this).val().length === 0) { 
      var that = $(this); 

      var onchange1 = onchange; 
      that.hide(); 
      that.remove(); 
      $('#txt').append('<div> removed! </div>'); 
      event.preventDefault(); 
     } 
    } 
}); 



$('#wrap').on('change', '#input:visible', onchange);​ 

http://jsfiddle.net/RbAua/12/