字符計數器 - 退格不反映在字符剩餘

這是我有的字符計數器代碼。它顯示剩餘的字符數。字符計數器 - 退格不反映在字符剩餘

HTML: 
<textarea></textarea> <span id='remainingC'></span> 

JS: 
$('textarea').keypress(function(){ 

if(this.value.length > 300){ 
    return false; 
} 
$("#remainingC").html((300 - this.value.length)+ "/ 300"); 
});

但我有一個問題。當我退格時，顯示的數字不會反映，只有當我開始寫作時，計數器纔會更新。

任何幫助，將不勝感激！

來源

2017-03-23 rory-h

'keypress' - >'keydown' – dandavis

的問題是所使用的退格時.keypress()不火。您應該使用input事件。另外，Math.max大大簡化了您剩餘的字符計算。

如果您想對<textarea>中的字符數執行實際上限，則始終可以添加屬性maxlength="300"。

$('textarea').on('input', function() { 
 
    $('#remainingC').text(
 
    Math.max(0, 300 - this.value.length) + '/300' 
 
) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<textarea maxlength="300"></textarea> <span id='remainingC'></span>

來源

2017-03-23 07:14:37 gyre

謝謝！這工作完全像我想要的。 –