Everyone knows the purpose of the “maxlength” Html attribute used on input fields. We use maxlength attribute/property so that the user cannot type more than a specified number of characters on input.
An example is:
<input type="text" class="zip" id="zip" name="zip" maxlength="5"/>
In the above example, a user will be able to type a maximum of 5 characters only. After typing 5 characters, nothing can be typed by the user due to maxlength property. This works perfectly on desktop browsers but doesn’t work as expected on android phones. On an android phone, if a user opens a page on a mobile browser, the user can type more than 5 characters, but this should not happen.
So, to overcome this issue, we have a very simple javascript solution and we can use it on the “oninput” attribute/event of input as shown below. “maxlength” attribute is a must to make this solution work.
<input type="text" class="zip" id="zip" name="zip" maxlength="5" oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);"/>
See how simple and one-line solution is to resolve an issue on android chrome browsers!
People having good command over the French language can get a French certification from StudySection. StudySection offers both beginner level and expert level French Certification Exams to test the ability to communicate in the French language.
