Web Programming with HTML5, CSS, and JavaScript

9.17 Constraint Validation Using the Number Control’s Attributes

With so many web pages that perform numeric calculations, the number control is very popular. Normally, browsers implement a number control with a spinner attached to the usual one-line plain text edit box. To see what we’re talking about, look at the spinners in the improved Water Balloons web page in FIGURE 9.21. The first number control shows what happens after the user clicks the spinner’s up arrow twice. The control shows 2 because the spinner’s starting value was 0, and each spinner click increments the value by 1. As an alternative to clicking the spinner arrows to adjust the number control’s value, users can enter numbers directly into the box. That’s particularly helpful ...