jQuery - char counter doesn't work with paste event
I wrote a jQuery character counter, it works when I type, but not when text is pasted.
The function is executed upon paste, but count doesn't change. I am not sure if val()
function is correct or really in synch with DOM. Any ideas?
counter = function () {
$j("strong#status-field-char-counter").text($j("#Panel1messagesmessage").val().length);
alert('event');
};
$j("textarea").keyup(counter);
$j("textarea").bind('paste', counter);
$j("#Panel1messagesmessage").bind('copy', counter);
$j("#Pan开发者_运维知识库el1messagesmessage").bind('delete', counter);
textarea contents can be changed in a number of ways, instead of trying to catch them all, simply install a routine that checks the content every 0.5 second, like
$(function() {
window.charCount = 0;
setInterval(function() {
var c = $("textarea").val().length;
if(c != window.charCount) {
window.charCount = c;
$("span").html(window.charCount);
}
}, 500);
})
I usually use keyup
in combination with change
The change
event fires when the textbox loses focus, but only if the value was modified since it received focus.
Quick play about:
$("#textarea").change(function() {
$("#status-field-char-counter").text($("#textarea").val().length);
}).keyup(function() {
$("#status-field-char-counter").text($("#textarea").val().length);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<p id="status-field-char-counter">here</p>
<input id="textarea" type="text" />
精彩评论