35-解决方案

10.8.2　解决方案

以所有 .remaining 消息为目标，对每条消息，寻找相关的 <textarea> 元素和 .count 子元素中列出的最大字符数。为 <textarea> 绑定一个 update 函数，在用户输入文本的时候捕获：

//对于找到的每个"Characters remaining: ###"元素
$('.remaining').each(function(){
　　 // 查找并存储读出的计数和相关的文本区域/输入字段
　　 var $count = $('.count',this);
　　 var $input = $(this).prev();
　　 //　.text()返回的是一个字符串,乘于1将得到一个数字(用于计算)
　　 var maximumCount = $count.text()*1;
　　 //在keyup、paster和input事件上调用的更新函数
　　 var update = function(){
　　　　　var before = $count.text()*1;
　　　　　var now = maximumCount - $input.val().length;
　　　　　//检查确保用户没有超过限制
　　　　　if ( now < 0 ){
　　　　　　　 var str = $input.val();
　　　　　　　 $input.val( str.substr(0,maximumCount) );
　　　　　　　 now = 0;
　　　　　}
　　　　　//只在必要时修改DOM
　　　　　if ( before != now ){
　　　　　　　 $count.text( now );
　　　　　}
　　 };
　　 //监听change事件(参见如下的讨论)
　　 $input.bind('input keyup paste', function(){setTimeout(update,0)} );
　　 //在开始时调用update,以防输入域预先填写
　　 update();
}); // 结束.each()