表單驗證JavaScript編號始終返回false

Question

我的文本框總是返回with字段，即使它不是數字。

HTML

<form name = garysForm>
Number of adults: <input type="number" size="6" id="ofAdults" name="adultBox" min="0" max="50" required><br>
Number of children: <input type="number" size="6" id="ofChild" min="0" max="50" required><br>
Date:<input type="text" name="date" id="datepicker" required><br>   
<Button type="button"   onclick="BookingFare(); return false;">Calculate</button><br>
</form>

使用Javascript

var field = document.forms["garysForm"]["adultBox"].value;

    if (isNaN(field.value)) {
            alert('Please enter a valid number');

        }

Answer 1

將值分配給field時，您正在調用field.value。

var field = document.forms["garysForm"]["adultBox"].value;

if (isNaN(field.value)) {

嘗試以下方法：

var field = document.forms["garysForm"]["adultBox"];

if (isNaN(field.value)) {

Answer 2

您可以使用其ID獲取成人框的值：

var field = document.getElementById("ofAdults").value;

if (isNaN(field)) {
    ....

Answer 3

我通過使用.elements方法解決了它。

var field = document.forms["garysForm"].elements["adultBox"].value;

然后，您需要考慮將SPACE也視為數字參考 。 因此，我采用了以下邏輯。

var field = document.forms["garysForm"].elements["adultBox"].value;
console.log(field)
if (field=='') {
    alert('Please enter a valid number');
}
else if (isNaN(field)) {
   alert('Please enter a valid number');
}
else {
   alert(field)
}     

DEMO

* jQuery僅用於演示目的。

希望這個答案對您有所幫助。 謝謝。