jQuery - char counter doesn't work with paste event

Question

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("#Panel1messagesmessage").bind('delete', counter);

'paste' is not listed as a valid event in docs.jquery.com/Events/bind ... also, you can add events as the 2nd param of bind() as a string with each event separated by a space $('#selector').bind('click mouseover', function(){} ) — artlung
– artlung, Commented Nov 2, 2009 at 15:48
Here's a SO question addressing unsupported events: stackoverflow.com/questions/237254/… — artlung
– artlung, Commented Nov 2, 2009 at 15:52

user187291 · Accepted Answer · 2009-11-02 14:02:43Z

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); })

Josh Stodola · Accepted Answer · 2009-11-02 14:18:59Z

3

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.

answered Nov 2, 2009 at 14:18

Josh Stodola

82.8k48 gold badges187 silver badges229 bronze badges

1 Comment

Irf Over a year ago

I did a try with keydown, but keyup seems to do the trick well, very much for paste as well.

Syfer · Accepted Answer · 2018-09-13 01:06:54Z

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" />

Collectives™ on Stack Overflow

jQuery - char counter doesn't work with paste event

3 Answers 3

Comments

1 Comment

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Linked

Related