javascript - jQuery 中类似 Twitter 的文本区域/输入计数器

Question

我正在试验 jQuery 中的文本区域/输入计数器。到目前为止，我已经写了这个:

$textarea.keyup(function(){
    $chars_remaining.html((200 - parseInt($textarea.val().length)));
});
$textarea.keydown(function(){
    $chars_remaining.html((200 - parseInt($textarea.val().length)));
});

但不知何故，如果我按下一个键超过 3 秒，计数器就会卡住，它的下降速度非常慢。相比之下，无论您键入/按住按键的速度有多快，Twitter 的计数器都不会遇到任何延迟。

我应该如何调整我的代码才能顺利运行？

谢谢!

Answer 1

如果你想使用自己的代码，试试这个。这是一个小插件。

(function($) {
    $.fn.counted = function(options) {
        var settings = {
            count: 300
        };    
        options = $.extend(settings, options || {});
        return this.each(function() {       
            var $this = $(this);    
            var counter = $('<div/>').html(options.count).insertAfter($(this));           
            $(this).keyup(function(e) {
                var count = options.count - $this.val().length;
                if (count >= 0) {
                    counter.html(count);
                } else {
                    $this.val($this.val().substr(0, options.count));
                    counter.html(0);
                }
            });
        });
    };
})(jQuery);

$(function() {
    $('textarea.counted').counted({count: 10});
});

fiddle 在这里:http://jsfiddle.net/XScwS/