Input valueAsNumber


Every once in a while I learn about a JavaScript property that I wish I had known about years earlier — valueAsNumber is one of them. The valueAsNumber provides the value of an input[type=number] as a Number type, instead of the traditional string representation when you get the value:

/*
 Assuming an <input type="number" value="1.234" />
*/

// BAD: Get the value and convert the number
input.value // "1.234"
const numberValue = parseFloat(input.value, 10);

// GOOD: Use valueAsNumber
input.valueAsNumber // 1.234

This property allows us to avoid parseInt/parseFloat, but one gotcha with valueAsNumber is that it will return NaN if the input is empty.

Thank you to Steve Sewell for making me aware of valueAsNumber!

  • Write Better JavaScript with Promises

    You’ve probably heard the talk around the water cooler about how promises are the future. All of the cool kids are using them, but you don’t see what makes them so special. Can’t you just use a callback? What’s the big deal? In this article, we’ll…

  • Page Visibility API

    One event that’s always been lacking within the document is a signal for when the user is looking at a given tab, or another tab. When does the user switch off our site to look at something else? When do they come back?

  • Multiple File Upload Input

    More often than not, I find myself wanting to upload more than one file at a time.  Having to use multiple “file” INPUT elements is annoying, slow, and inefficient.  And if I hate them, I can’t imagine how annoyed my users would be.  Luckily Safari, Chrome…

  • SmoothScroll Using MooTools 1.2


Source link

Leave a Reply

Your email address will not be published.