Почему Paste Event в jquery срабатывает при предварительной вставке?

Question

Я пытаюсь сделать текстовое поле похожим на Twitter , для этого я написал код для

• Количество слов
• Используемые изменения событий, Keyup и Paste

События Keyup и Change работают нормально, но событие вставки немного странно, когда я вставляю что-то в textarea, число слов в этот момент не меняется, после некоторой отладки я обнаружил, что событие paste запускается перед вставкой что-то в текстовом поле . Я не знаю, как они справляются с этим в Твиттере. Вот мой код: события:

'click #textboxId'  : 'submitQuestion'
'keyup #textboxId'  : 'wordCounter'
'change #textboxId' : 'wordCounter'
'paste #textboxId'  : 'wordCounter'

wordCounter: ->  
  #Code for Word Count#  

Из-за предварительной вставки события вставки количество рабочих мест в этом экземпляре не изменяется.
Мы будем благодарны за ваши предложения и помощь. Спасибо за ваше время.

Answer 1

См. Этот пример.

http://jsfiddle.net/urEhK/1

$('textarea').bind('input propertychange', function() {
    $('#output').html($(this).val().length + ' characters');
});

Это поведение было очень странным. Вы думаете, что одно из этих событий уловит это правильно? Я был удивлен, что не было больше ответов на это через Google.

Answer 2

   function update()    
   {
       alert($textbox.val().length);
   }


    var $textbox = $('input');
    $textbox.bind('keyup change cut paste', function(){
        update(); //code to count or do something else
    });
    // And this line is to catch the browser paste event
    $textbox.bind('input paste',function(e){ setTimeout( update, 250); });  

Answer 3

Вы можете сделать одну вещь, которая сначала получить исходные данные. Затем вы можете получить данные вставки события и добавить их.

  $("#id").on("paste keypress ",function(event){
                // eg. you want to get last lenght
                 var length=$("#id").val().length;
                 if(event.type == "paste"){
                    //then you can get paste event data.=

length+=event.originalEvent.clipboardData.getData('text').length;
                }


            });`

Answer 4

Теперь вы должны использовать on () вместо bind () см. Этот пост .Также нет необходимости создавать именованную функцию, вы можете просто создать анонимную функцию.

$('#pasteElement').on('paste', function() {
    setTimeout(function(){
        alert($('#pasteElement').val());
    }, 100);
});