Follow Us on Twitter

Enforce the HTML5 max attribute of input items with JavaScript

by Patrick Sinke on February 10, 2018 · 27 comments

The HTML5 max and min attribute on input items

The max attribute is introduced in HTML5 and specifies the maximum value for an <input> element. Unfortunately, it doesn’t enforce the maximum value entered when typing in numbers as you might expect.

The syntax for the HTML element is as follows:

<input max=”number|date“>

With a small JavaScript function it’s possible to make sure no value larger than the max value (or smaller than the min value) may be entered. Just put the following code in your $(document).ready(function) {}:

   $(document).on('keyup', '.myInputItem', function () {
      if (parseInt($(this).val()) >= $(this).attr('max'))
      {
         $(this).val($(this).attr('max'));
      }
   });

The function fires on the keyup event. The if statement compares the value of the input item with the max value. When it is higher, it will replace the contents with the max value.

 

Enforce the HTML5 max attribute of input items with JavaScript, 5.0 out of 5 based on 1 rating
Ratings:
VN:D [1.9.22_1171]
Rating: 5.0/5 (1 vote cast)
Tags: , , ,

{ 27 comments… read them below or add one }

Outlook Error Code 550 July 12, 2019 at 7:29 am

VERY HELPFUL KEEP WRITING AND SHARING THESE BLOG.

Reply

Fix HP BIOHD Error Code 8 July 19, 2019 at 1:13 pm

Thanks for sharing thats article are amazing for more information of tecnology visite our website click here Fix HP BIOHD Error Code 8

Reply

Fix 79 Service Error HP Printer July 31, 2019 at 9:29 am

Hi there,

Nice blog. I found this blog very useful. Your blog will be very beneficial for everyone. I have bookmarked your website. Please keep your effort continuous and keep providing us your valuable information and suggestions.
Also visit blog posted by Robin.

Visit Now hpsupport365

Reply

hp printer error 0x610000f6 August 1, 2019 at 12:44 pm

Thanks for sharing thats article are amazing for more information of tecnology visite our website click here hp printer error 0x610000f6

Reply

adobe flash player error code 1013 August 9, 2019 at 12:11 pm

Great Post about Tracking Trends. Keep up the good work sir. Thanks for sharing If you facing any problem regarding adobe flash player error code 1013

Reply

epson error code 0x69 August 9, 2019 at 1:09 pm

Great information you shared through this blog. Keep it up and best of luck for your future blogs and posts.epson error code 0x69

Reply

hp error code 0xc0000034 August 19, 2019 at 11:35 am

Great Post about Tracking Trends. Keep up the good work sir. Thanks for sharing hp error code 0xc0000034

Reply

adobe flash player connection error August 20, 2019 at 2:08 pm

Great Post about Tracking Trends. Keep up the good work sir. Thanks for sharing If you facing any problem regarding adobe flash player connection error

Reply

block email addresses in aol August 23, 2019 at 11:52 am

Thanks for sharing this valuable content with us this work is appreciable and I have bookmarked your website.

Reply

Fix Lexmark printer error code 900 August 26, 2019 at 10:53 am

Thanks for sharing this valuable content with us this work is appreciable and I have bookmarked your website.

Reply

Steps To Fix Safari Can’t Establish A Secure Connection September 4, 2019 at 1:20 pm

Excellent and nice post. This is such a great resource that you are providing and you give it away for free. I love seeing that understands the value. I’m glad to have found this posting as its such an interesting one.

Reply

epson error code 0xea September 9, 2019 at 12:48 pm

Thanks for sharing this valuable content with us this work is appreciable and I have bookmarked your website.

Reply

Epson Wireless Printer Setup September 21, 2019 at 11:37 am

Do you want to set up Epson printer? Are you facing Epson wireless printer setup issue? If yes, we can help you. We have a dedicated team of trained printer technicians, who are technically proficient to set up Epson printer in the right technical ways. Do you have low budget to give for the services? So, don’t worry more, our techies know the technical ways better to set up your Epson printer in the right technical ways.

Reply

www.epson.com/support September 27, 2019 at 7:50 am

Epson printers are famous among the others one for its advanced printing technology that enables it to deliver the high-quality of printouts with great speed. Even though using advanced technology, glitches appear which couldn’t be unavoidable. Generally, helpless users complain about technical errors that they face on Epson printer and seek for instant assistance. In such point, it is recommended to tap on the link epson.com/support as team of highly proficient staff has collected all the basic information related to Epson printer which will helpful for you in terminating the printer related hurdles in an effort-free manner.

Reply

Best Assignment Writing Services November 12, 2019 at 3:26 pm

Acquiring Custom Assignment Writing Services from a credible firm like Legitimate Assignment Writing Company ensures that you attain excellence, especially in your College Assignment Writing Services endeavors, which can be challenging in many instances.

Reply

brother printer offline windows 10 December 6, 2019 at 2:13 pm

I would like to thank you for the efforts you have made in writing this article. I am hoping the same best work from you in the future as well. In fact your creative writing abilities has inspired me.

Reply

Offsidetech December 27, 2019 at 4:00 pm

Amazing,Thanks for sharing a nice information,its a very authentic info which you provide.

Reply

HP Customer Service February 5, 2020 at 9:02 am

Thanks for the information.

Reply

MS Excel Run Time File Error 13 March 13, 2020 at 1:28 pm

Thanks and keep posting such a informative blogs. If you want you can also read this blog which talk about MS Excel Run Time File Error 13 in a very easy way.

Reply

Printer Not Activated Error Code 20 March 18, 2020 at 2:12 pm

You have got some great posts in your blog. Keep up with the good work.

Reply

Dell Printer Error 0502 March 28, 2020 at 1:00 pm

I would like to thank you for the efforts you have made in writing this article. I am hoping the same best work from you in the future as well.
Read the blog also
Dell Printer Error 0502

Reply

Windows Error Code 0x80070652 April 4, 2020 at 5:26 pm

I would like to thank you for the efforts you have made in writing this article. Also read this blog which talk about Windows Error Code 0x80070652 in a very easy way.

Reply

Hp Printer Not Responding April 15, 2020 at 4:55 pm

I was very pleased to find this site. I wanted to thank you for this great read!! I definitely enjoyed every little bit of it and I have you bookmarked to check out the new stuff you post.

Reply

English Language Writing Services June 23, 2020 at 7:04 am

Those ESL assignment writing services have an advantage of hiring the best English language coursework writing service company that is familiar with ESL assignment help services for their English Language Writing Services.

Reply

Help with Coursework Writing services June 23, 2020 at 2:47 pm

There are many Online Coursework writing services and Help with Coursework Writing services to choose from for those stuck with their psychology coursework writing services and nursing coursework writing help services.

Reply

Biological Science Writing Services July 8, 2020 at 7:42 am

Biological science assignment writing service seekers have been on the rise lately since most learners need Biological Science Writing Services, biology research paper services and biological science essay writing services.

Reply

Hp Support Assistant August 11, 2020 at 10:16 am

It was a mesmerizing article, I really owe to you, keep writing such staff which helps readers to evaluate themselves.

Reply

Leave a Comment

 

Previous post:

Next post:

About Whitehorses
Company profile
Services
Technology

Whitehorses website

Home page
Whitebooks
Jobs

Follow us
Blog post RSS
Comment RSS
Twitter