How To: Limit Input Box Characters To Defined Count Using jQuery


Earlier today working on a project , I found one trick which I would like to share. Here is a small code that limit a input box for defined number of characters.

Please take a look on following example:

HTML

1
<input id="myInput" value=""/>

.

Jquery snippet

Assuming we have to limit characters to 20.

1
2
3
4
5
6
7
$(document).ready(function(){	
	$('#myInput').keyup( function() {
		var $this = $(this);
		if($this.val().length > 20)
			$this.val($this.val().substr(0, 20));			
	});
     });

.

That’s it, yeah its done!! You can check Working Demo

Any updations, suggestions and corrections are welcome.

Recently Published

»

Importance and actions of cloud computing in e-commerce business

The e-commerce industry is growing in leaps and bounds, and, ...

»

How to remove Options from One Select Box and retain One Option?

One can easily remove  options of a select box from HTML and append ...

»

How to Ensure that Users Do Not Deactivate The Critical WordPress Plugins

It’s no secret that among all the remarkably useful features of ...

»

How to scroll to the top of a webpage using jQuery ?

If you are looking for an extraordinary method of smoothly scrolling ...

»

11 sources to gain perfect knowledge of html5 semantic tags

1. Html5tuts Html5tuts is a site dedicated to HTML5. Feel free to ...

»

How to move an element into another parent element using jQuery?

An important piece to the puzzle when coding with jQuery is that how ...

»

10 optionally Good WordPress Typography Plugins You could Opt For

It is not necessary that the person will follow the standard guide ...

»

8 creative 3d slider wordpress themes to keep your blog active

1. Display Display is a WordPress Theme best used for Portfolio and ...

»

11 quick remote screen sharing apps worth trying

1. Join Me Easy to start, easy to join, easy to manage, join.me takes ...