How to check string length with JavaScript

Question

I want to get the string length when a key is pressed like StackOverflow does     I have tried to do this with onblur  but it s not working   How do I do this

User · Answer

Basically  assign a keyup handler to the  lt textarea gt  element  in it count the length of the  lt textarea gt  and write the count to a separate  lt div gt  if its length is shorter than a minimum value   Here s is an example-   x000D   x000D  var min   15  x000D  document querySelector   tst   onkeyup   function e   x000D   document querySelector   counter   innerHTML    x000D                 this value length  lt  min  x000D                    min - this value length    to go     x000D                       x000D    x000D       x000D  body  font  normal 0 8em verdana  arial   x000D   counter  color  grey  x000D   lt textarea id  tst  cols  60  rows  10  gt  lt  textarea gt  x000D   lt div id  counter  gt  lt  div gt  x000D   x000D   x000D

User · Answer

lt html gt   lt head gt  lt  head gt   lt title gt  lt  title gt   lt script src   js jquery-3 2 1 min js  type  text javascript  gt  lt  script gt   lt body gt  Type here  lt input type  text  id  inputbox  value  type here   gt   lt br gt  Length  lt input type  text  id  length   gt   lt script type  text javascript  gt        window  keydown function  e          use e which     var length   0      if     inputbox   val   toString   trim   length  gt  0                length       inputbox   val   toString   trim   length                 length   val length toString           lt  script gt   lt  body gt   lt  html gt

User · Answer

I m not sure what you mean by having tried it onblur  but to get the length of any string  use its  length property  so in the case of a textbox or textarea   document getElementById  textarea   value length   Changing that ID  of course  to whatever the actual ID is

User · Answer

UPDATE  Since I wrote this  the input event has gotten a decent level of support  It is still not 100  in IE9  so you will have to wait a bit until IE9 is fully phased out  In light of my answer to this question  however  input is more than a decent replacement for the method I ve presented  so I recommend switching   Use keyup event   x000D   x000D  var inp   document getElementById  myinput    x000D  var chars   document getElementById  chars    x000D  inp onkeyup   function     x000D    chars innerHTML   inp value length  x000D    x000D   lt input id  myinput  gt  lt span id  chars  gt 0 lt  span gt  x000D   x000D   x000D    EDIT   Just a note for those that suggest keydown  That won t work  The keydown fires before character is added to the input box or textarea  so the length of the value would be wrong  one step behind   Therefore  the only solution that works is keyup  which fires after the character is added

User · Answer

You should bind a function to keyup event  textarea keyup   function       textarea value length          with jquery     textarea   keyup function       var length     this  val   length

User · Answer

As for the question which event you should use for this  use the input event  and fall back to keyup keydown in older browsers   Here   s an example  DOM0-style   someElement oninput   function       this onkeydown   null       Your code goes here    someElement onkeydown   function          Your code goes here        The other question is how to count the number of characters in the string  Depending on your definition of    character     all answers posted so far are incorrect  The string length answer is only reliable when you   re certain that only BMP Unicode symbols will be entered  For example   a  length    1  as you   d expect   However  for supplementary  non-BMP  symbols  things are a bit different  For example     length    2  even though there   s only one Unicode symbol there  This is because JavaScript exposes UCS-2 code units as    characters      Luckily  it   s still possible to count the number of Unicode symbols in a JavaScript string through some hackery  You could use Punycode js   s utility functions to convert between UCS-2 strings and Unicode code points for this       String length  replacement that only counts full Unicode characters punycode ucs2 decode  a   length     1 punycode ucs2 decode     length     1  note that     length    2      P S  I just noticed the counter script that Stack Overflow uses gets this wrong  Try entering   and you   ll see that it  incorrectly  counts as two characters

User · Answer

x000D   x000D  function cool d  x000D    x000D      alert d value length   x000D    x000D   lt input type  text  value    onblur  cool this   gt  x000D   x000D   x000D    It will return the length of string  Instead of blur use keydown event

User · Answer

Leaving a reply  and an answer to the question title   For the future googlers    You can use  length to get the length of a string   var x    Mozilla   var empty       console log  Mozilla is     x length     code units long       quot Mozilla is 7 code units long quot     console log  The empty string has a length of     empty length      quot The empty string has a length of 0 quot      If you intend to get the length of a textarea say id  quot txtarea quot  then you can use the following code  txtarea   document getElementById  txtarea    console log txtarea value length    You should be able to get away with using this with BMP Unicode symbols  If you want to support  quot non BMP Symbols quot  like     then its an edge case  and you need to find some work around

User · Answer

That s the function I wrote to get string in Unicode characters  function nbUnicodeLength string       var stringIndex   0      var unicodeIndex   0      var length   string length      var second      var first      while  stringIndex  lt  length             first   string charCodeAt stringIndex       returns an integer between 0 and 65535 representing the UTF-16 code unit at the given index          if  first  gt   0xD800  amp  amp  first  lt   0xDBFF  amp  amp  string length  gt  stringIndex   1                second   string charCodeAt stringIndex   1               if  second  gt   0xDC00  amp  amp  second  lt   0xDFFF                    stringIndex    2                else                   stringIndex    1                          else               stringIndex    1                     unicodeIndex    1            return unicodeIndex

User · Answer

The quick and dirty way would be to simple bind to the keyup event    x000D   x000D      mytxt   keyup function    x000D          divlen   text  you typed     this value length     characters    x000D      x000D   lt script src  https   ajax googleapis com ajax libs jquery 2 1 1 jquery min js  gt  lt  script gt  x000D   x000D   lt input type text id mytxt  gt  x000D   lt div id divlen gt  lt  div gt  x000D   x000D   x000D    But better would be to bind a reusable function to several events  For example also to the change    so you can also anticipate text changes such as pastes  with the context menu  shortcuts would also be caught by the keyup

User · Answer

var myString    sample String     var length   myString length     first you need to defined a keypressed handler or some kind of a event trigger to listen    btw   getting the length is really simple like mentioned above

[javascript] How to check string length with JavaScript

Examples related to javascript

Examples related to forms