为什么 jQuery 中的粘贴事件会在预粘贴时触发？

发布于 2024-12-21 18:38:48 字数 589 浏览 0 评论 0原文

我正在尝试使文本框类似于 Twitter，为此我编写了代码：

字数
使用事件更改、Keyup 和粘贴

Keyup 和 Change 事件工作正常，但粘贴事件有点奇怪，当我在文本区域中粘贴某些内容时，字数此时不会改变，经过一些调试后，我发现粘贴事件在将某些内容粘贴到文本框之前< /强>。我不知道 Twitter 上他们是如何处理这个问题的。

这是我的代码：
事件：

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

wordCounter: ->  
  #Code for Word Count#

由于粘贴事件的预粘贴性质，该实例上的工作计数不会改变。

我们将不胜感激您的建议和帮助。

原文

I am trying to make textbox similar to the Twitter, for this I have written code for:

Word Count
Used Events Change, Keyup and Paste

Keyup and Change Events are working fine but paste event is little bit strange, when I paste something in textarea the word count doesn't change at that moment, after some debugging I found that paste event fires up before pasting something on textbox. I don't know how they handle this in Twitter.

Here is my code:
events:

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

wordCounter: ->  
  #Code for Word Count#

Due to pre-paste nature of paste event the work count doesn't changes on that instance.

Your suggestion and help will be appreciated.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

不一样的天空 2024-12-28 18:38:48

请参阅此示例。

http://jsfiddle.net/urEhK/1

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

这种行为非常奇怪。您认为其中一个事件能够正确捕捉到这一点吗？我很惊讶谷歌没有找到更多答案。

See this example.

http://jsfiddle.net/urEhK/1

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

That behavior was very weird. You would think that one of those events would catch this properly? I was surprised there weren't more answers to this via Google.

回复收藏 0 原文

书间行客 2024-12-28 18:38:48

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

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

回复收藏 0 原文

孤凫 2024-12-28 18:38:48

您现在应该使用 on() 而不是 bind() 查看这篇文章。
也不需要创建命名函数，您可以只创建匿名函数。

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

You should now use on() instead of bind() see this post.
It's also unnecessary to create a named function, you can just create a anonymous function.

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

回复收藏 0 原文

無心 2024-12-28 18:38:48

您可以做一件事，首先获取原始数据。然后您可以获取事件粘贴数据并添加它们。

  $("#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;
                }


            });`

You can do one thing that firstly get original data . then you can get the event paste data and add them.

  $("#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;
                }


            });`

回复收藏 0 原文

~没有更多了~