keyup keydown jquery處理

Question

我用鍵事件監聽器來構造jquery。

我的問題是，只有當我放開之前按下的每個鍵時纔會觸發。

舉例： 我經常使用cmd +左選擇我的文本，我仍然按住cmd來複制它。 但是，當我放開命令（所有鍵）時，文本才被選中， 。

$('.komand-line').focus(function(){ 
    var caret='<div class="komand-caret-wrapper"><div class="komand-caret"></div></div>'; 
    $('.komand-fake').html(caret+$(this).val()); 
    $(this).on('keydown keyup mousedown mouseup mousemove',function(){ 
     $('.komand-fake').html($(this).val()); 
     startpos = $(this)[0].selectionStart; 
     endpos = $(this)[0].selectionEnd; 
     $('#komand .komand-caret').remove(); 
     if(endpos > startpos){ 
       var output = [$('.komand-fake').html().slice(0, startpos),'<div class="komand-selected">',$('.komand-fake').html().slice(startpos,endpos),'</div>',$('.komand-fake').html().slice(endpos)].join(''); 
     }else{ 
      var output = [$('.komand-fake').html().slice(0, startpos), caret, $('.komand-fake').html().slice(startpos)].join(''); 
     } 
     $('.komand-fake').html(output); 
    }); 
}); 

這是我用來調用監聽器的代碼。 我希望一切都完成了「而」鍵/ s被按下。 你可以測試當前的行爲http://server.hvlmnns.de/

任何想法如何防止這種情況？ 我想我會需要像按鍵時按下，但按鍵方法doesen't 正常工作。

Answer 1

包裝超時函數處理程序中的函數完美無缺。

function komandCaret(el,caret){ 
    var komandCaretInterval = setInterval(function() { 
     $('.komand-fake').html(el.val()); 
     startpos = el[0].selectionStart; 
     endpos = el[0].selectionEnd; 
     $('#komand .komand-caret').remove(); 
     if(endpos > startpos){ 
       var output = [$('.komand-fake').html().slice(0, startpos),'<div class="komand-selected">',$('.komand-fake').html().slice(startpos,endpos),'</div>',$('.komand-fake').html().slice(endpos)].join(''); 
     }else{ 
      var output = [$('.komand-fake').html().slice(0, startpos), caret, $('.komand-fake').html().slice(startpos)].join(''); 
     } 
     $('.komand-fake').html(output); 
    },10); 
} 

$(document).ready(function(){ 
    $('.komand-fake').html($('.komand-line').val()); 
    $('.komand-fake').on('keydown mousedown keyup mouseup',function(e){ 
     $('.komand-line').focus();  
    }); 
    $('.komand-line').focus(function(){ 
     var caret='<div class="komand-caret-wrapper"><div class="komand-caret"></div></div>'; 
     $('.komand-fake').html(caret+$(this).val()); 
     $(this).on('keydown mousedown ',function(e){ 
      komandCaret($(this),caret); 
     }); 
    }); 
    $('.komand-line').focus(); 
    $(document).on('blur','.komand-line',function(){ 
     $('#komand .komand-caret').remove(); 
    }); 
});