I am trying to preform some form validation, and for some reason when I enter a number on the input field it shows the typeof as a string.

I really can't wrap my head around this. I have tried researching online but couldn't find an answer.

Any help would be really appreciated. Below is my code a link to jsfiddle example.

Thank you in advance

/

<button>Check if number</button>
<input id="number" type="number">

<script>

$("button").click(function () {

    var number = $("#number").val();

    alert(typeof (number));

    if(typeof number !== "number"){
        alert("not a number");
    }




});


</script>

I am trying to preform some form validation, and for some reason when I enter a number on the input field it shows the typeof as a string.

I really can't wrap my head around this. I have tried researching online but couldn't find an answer.

Any help would be really appreciated. Below is my code a link to jsfiddle example.

Thank you in advance

https://jsfiddle/eldan88/2xb47g78/

<button>Check if number</button>
<input id="number" type="number">

<script>

$("button").click(function () {

    var number = $("#number").val();

    alert(typeof (number));

    if(typeof number !== "number"){
        alert("not a number");
    }




});


</script>

• javascript
• jquery

• 1 Using .val() will always return a string. You can try and parse it as an int first then check it.... var number = parseInt($("#number").val()); – An0nC0d3r Commented Nov 6, 2015 at 20:08
• @AdamJeffers that won't work - typeof(NaN) is "number". What is needed is the isNaN() function. – TAGraves Commented Nov 6, 2015 at 20:16
• @TAGraves... by "check it" I meant check that it parses as an int... should have been a bit clearer :-/ – An0nC0d3r Commented Nov 6, 2015 at 21:42

6 Answers 6

This is because the value of an input is always a string. For example, when I'm entering 3, the actual value is not the number 3, it is the string "3". To check if it is not a number, use isNaN(), a Javascript native function to check if something is not a number. For example, when you run isNaN("3") it will return false, since 3 is a number.

The value property of an input element is always stored as a string, so typeof is always going to return "string".

https://developer.mozilla/en-US/docs/Web/API/HTMLInputElement

You need to write your own custom functions to determine the type of the input.

The input element with a type attribute whose value is "number" represents a precise control for setting the element’s value to a string representing a number.

http://www.w3/TR/html-markup/input.number.html

So no matter what, an input contains a string.

Here on w3. it adivses:-

value = floating-point number #

A string representing a number.

As others have stated, HTML input elements always store their values as strings, even if those values are "numeric strings." Here's one way of making your validation work:

$("button").click(function () {

    var number = $("#number").val();

    alert(Number(number));

    if(isNaN(Number(number))){
        alert("not a number");
    }

});

var myVar=5
alert(typeof myVar) //Number

var myVar = "5"
alert(typeof myVar) //String

var myVar = "5"
var vResult = parseInt(myVar);
alert(typeof vResult) //Number

In your case what's returned from the text box is .val() which is always a string.