Question

我已经创建了一个在JQuery库中使用的字符计数器，它具有与Twitter计数器类似的效果（剩下的字符左计数器）。但是，我注意到至少FireFox处理它的时间很长（其他浏览器显示出一些压力，但并不差）。基本上，在以稳定的速度打字时，它会开始“追赶”甚至让浏览器反应迟钝，直到它确实赶上来。在Twitter的文本框中尝试相同的打字速度时，它根本没有减速！

虽然我有一个观看此框的autoresize插件，但我尝试了很多删除和更改，以发现只有这个代码导致速度变慢。因此，虽然我可以假设浏览器在某个时间处理的数学可能太多，但我真的不明白为什么会出现这么简单的问题，也不会想到解决方案。

/* Post Saying text count */
var postSayingLimit = 450;
$('span.counter').text(postSayingLimit);
$('#post-saying').bind('keyup keypress', function() {
    var postSayingUsed = $(this).val().length;
    if(postSayingUsed >= postSayingLimit - postSayingLimit / 10) {
    $(this).parent().find('span.counter').addClass('counter-limit');
    } else {
    $(this).parent().find('span.counter').removeClass('counter-limit');
    }
    var postSayingCount = postSayingLimit - postSayingUsed;
    $(this).parent().find('span.counter').text(postSayingCount);
});

我已经尝试删除条件，转到一个绑定，甚至插入硬值只是为了继续它的延迟。也许将一些变量移出bind函数？使实际的计数器过程也成为一个函数？

Answer 1

您希望尽可能多地移动元素，并且您只想在必要时运行类删除。（在找出确定是否有必要的有效方法之前，有必要尝试不再重复搜索。）

Answer 2

我在这里做了一个例子：http://jsfiddle.net/zpjc6/

对我来说很快（虽然铬）。通过在变量中保存跨度，我也做了一些小的改进。虽然这样做是好习惯，但它不应该昂贵。但也许它会有所帮助。

编辑：也许你可以链接到你的实际网站？

textfield Counter是Laggy

2 个答案: