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(); 
    }); 
});