Javascript-强制输入特定数据类型或仅接受数字输入

Question

Just starting out on my coding journey. I have this prompt and I'm trying to force the user to only input numbers. any other characters are not allowed. Any idea how I can do this?

var num = prompt("Enter number");

I've tried

var num=Number(prompt("Enter number"));

I've also tried making a loop like this but i know prompt returns a string:

while (typeof(num)!=='number'{
        alert("You did not enter a number);
        var num=prompt("Enter number"));}

I've also tried:

var num= Number(prompt("Enter number"));
while (num===/==NaN){
        alert("You did not enter a number);
        var num=Number(prompt("Enter number"));}
alert("You did enter a number");   

Entering any non number characters into the Number prompt results in NaN, so I thought that if the answer is NaN every time non-numerical characters are entered, then the loop would trigger, and otherwise it wouldn't but that doesn't seem to be the case for some reason. Any help would be appreciated :)

Answer 1

var answer = prompt("Enter a number:");
while (!/^[0-9]+$/.test(answer)) {
    alert("You did not enter a number.");
    answer = prompt("Enter a number: ");
}
alert("You entered a number.");

How does this work?

/^[0-9]+$/ is known as a regular expression. ^ specifies start of the string, $ specifies the end of the string, [0-9] specifies a digits, and + specifies one or more occurrences of . The given regular expression says "starting from the start of the string up to the end of the string, there should be one or more occurrences of a digit, and nothing else." The nothing else part comes in because we are not accepting anything other than digits. If we were, we would put them in the regular expression.

/^[0-9]+$/.test returns a boolean depending on whether or not the string matches the given regular expression.

Answer 2

Prompts aren't usually the best for inputs since they do not allow any control, but if you're okay with a while loop this might be a good solution:

var answer = prompt("Enter number")
while (answer !== parseInt(answer, 10).toString()) {
    alert("Please enter only numbers!");
    answer = prompt("Enter number");
}

parseInt(answer, 10) "extracts" Numbers from Strings (the second argument is the base, in our case 10 ie decimal). parseInt("5", 10) is 5 , and parseInt("5foo", 10) is also 5 .

Basically, if the user enters an integer into the prompt , then parseInt(answer, 10).toString() === answer is true. We use .toString() to convert the resulting Number to String so we can compare it with the actual value that the user entered, which is always stored as a String in case of prompt .

We can use this logic to check if the user actually entered an integer or not.

That said, I would really recommend you to use something like <input type="number"> which would 'enforce' numeric inputs in a much easier/straightforward way.

Answer 3

So, on top of the regex solution posted, here's a summation of both @namanyayG's, Barmar's and @evolutionxbox's answers:

var num = Number(prompt("Enter whole number"));

while (num !== parseInt(num).toString()) {
    alert("Please enter only numbers!");
    num = prompt("Enter number");
}

OR for Float numbers:

var num = prompt("Enter whole number");

while (num !== parseFloat(num).toString()) {
    alert("Please enter only numbers!");
    num = prompt("Enter number");
}

OR

var num = Number(prompt("Enter whole number"));

while (isNaN(num)!=="false"){
    alert("You did not enter a whole number");
    var num = prompt("Enter number");
}

For some unknown to me reason, isNaN(num)!=="false" is not the same as isNaN(num)==/==="true"