textarea character limit

by

I found a good solution that uses the maxlength attribute if the browser supports it, and falls back to an unobtrusive javascript pollyfill in unsupporting browsers.

Thanks to @Dan Tello’s comment I fixed it up so it works in IE7+ as well:

HTML:

<textarea maxlength="50" id="text">This textarea has a character limit of 50.</textarea>

Javascript:

function maxLength(el) {    
    if (!('maxLength' in el)) {
        var max = el.attributes.maxLength.value;
        el.onkeypress = function () {
            if (this.value.length >= max) return false;
        };
    }
}

maxLength(document.getElementById("text"));

Demo

There is no such thing as a minlength attribute in HTML5.
For the following input types: number, range, date, datetime, datetime-local, month, time, and week (which aren’t fully supported yet) use the min and max attributes.

More Related Contents:

  1. 5 stars and the golden 5 stars are not together (When browsing with Internet explorer)
  2. Get the size of the screen, current web page and browser window
  3. Creating a textarea with auto-resize
  4. Rendering HTML inside textarea
  5. contenteditable, set caret at the end of the text (cross-browser)
  6. How to autosize a textarea using Prototype?
  7. How to get selected text from a textbox control with JavaScript
  8. How to impose maxlength on textArea in HTML using JavaScript
  9. How to add line breaks to an HTML textarea
  10. Show datalist labels but submit the actual value
  11. How to add/update an attribute to an HTML element using JavaScript?
  12. Prevent zoom cross-browser
  13. Chrome counts characters wrong in textarea with maxlength attribute
  14. How do you get the cursor position in a textarea?
  15. Use tab to indent in textarea
  16. How to get number of rows in using JavaScript?
  17. Close Current Tab
  18. How FileReader.readAsText in HTML5 File API works?
  19. Enter key press behaves like a Tab in Javascript
  20. Inserting text at cursor in a textarea, with Javascript
  21. How do I change the ID of a HTML element with JavaScript?
  22. IE8 alternative to window.scrollY?
  23. How to read line by line of a text area HTML tag
  24. Finding number of lines in an html textarea
  25. Is there any problem with using HTML5’s “data-*” attributes for older browsers?
  26. How to make an HTML element editable cross-browser?
  27. Get the offset position of the caret in a textarea in pixels [duplicate]
  28. How to detect supported video formats for the HTML5 video tag?
  29. Testing for multiple screens with javascript
  30. Find caret position in textarea in pixels [duplicate]

Leave a Comment