Question

我正在处理一个javascript项目，它会获取信息并提交它。我应该验证数量输入中只有数字并弹出一个警告框，如果不存在则不提交。它们可以是空白的，只要它们有任何输入它只是数字。我已经验证了它，并查看了提交页面，它显示如果我输入字母，特定数量字段不提交（我有三个数量），但其他一切都有。如果任何数量不是数字，它应该抛出警报并停止提交页面。我一遍又一遍地看着这个并尝试了一些东西，但似乎无法找到我的错误。我希望有任何方向可以解决这个问题。

<script>
  //function to check for valid fruit quantities
  function certifyDigits() {
    var b = document.getElementById("blueberries").value;
    var c = document.getElementById("cherries").value;
    var s = document.getElementbyId("strawberries").value;
    if (!b.match(/^\d+$/)) {
      alert("Please enter only numbers for quantity!");
      return false;
    }

    if (!c.match(/^\d+$/)) {
      alert("Please enter only numbers for quantity!");
      return false;
    }

    if (!s.match(/^\d+$/)) {
      alert("Please enter only numbers for quantity!");
      return false;
    }

  }
</script>
</head>

<body>

  <h2>Fruit Purchasing Form</h2>

  <table class="main">
    <tr>
      <th class="a">&nbsp;</th>
      <th class="a">Blueberries</th>
      <th class="a">Cherries</th>
      <th class="a">Strawberries</th>
    </tr>
    <tr>
      <th class="a">Price</th>
      <td class="b">$2.50</td>
      <td class="b">$4.40</td>
      <td class="b">$8.00</td>
    </tr>
    <tr>
      <th class="a">Shipping Weight</th>
      <td class="b">2.0</td>
      <td class="b">4.0</td>
      <td class="b">4.0</td>
    </tr>
  </table>
  <br />
  <br />
  <br />
  <br />

  <form name="fruitOrder" action="http://www.textXXX.php" method="post" onSubmit="return certifyDigits()">

    <h3>Select Quantity of Fruit Desired</h3>
    <br />

    <p>Blueberries:</p>
    <input id="blueberries" type="text" size=5>
    <p>Cherries:</p>
    <input id="cherries" type="text" size=5>
    <p>Strawberries:</p>
    <input id="strawberries" type="text" size=5>

    <br />
    <br />

    <h3>Customer Information</h3>
    <br />
    <label>Your Last Name:
      <input type="text" name="lastname" id="lastname" size="25" />
    </label>
    <br />
    <label>Your First Name:
      <input type="text" name="firstname" id="firstname" size="25" />
    </label>
    <br />
    <label>Street Address:
      <input type="text" name="street" id="street" size="60" />
    </label>
    <br />
    <label>City, State, Zip Code:
      <input type="text" name="citystatezip" id="citystatezip" size="60" />
    </label>
    <br />

    <h3>Payment Method</h3>
    <label>Visa
      <input type="radio" name="payment_type" id="payment_type_Visa" value="Visa" checked />
    </label>
    <br />
    <label>Mastercard
      <input type="radio" name="payment_type" id="payment_type_MC" value="MC" />
    </label>
    <br />
    <label>American_Express
      <input type="radio" name="payment_type" id="payment_type_amex" value="amex" />
    </label>
    <br />
    <br />
    <input type="submit" value="SUBMIT" />
  </form>

Answer 1

javascript match（）函数总是返回一个数组。如果匹配为true，则数组将包含匹配值。如果匹配为false，则数组将包含空字符串。将您的if语句更改为

if (b.match(/^\d+$/)[0] === "") {

那应该解决它。

Answer 2

为什么不仅仅为数字验证输入？

function validate_numbers(evt){ 
  var theEvent=evt || window.event; 
  var key=theEvent.keyCode || theEvent.which; 
  key=String.fromCharCode(key); 
  var regex=/[0-9]|\.|\,|\/|\ /;

  if(!regex.test(key)){ 
    theEvent.returnValue=false; 
    if(theEvent.preventDefault)theEvent.preventDefault(); 
  }; 
};

Answer 3

应该是：document.getElementById（“草莓”）。值;

不是：document.getElementbyId（“草莓”）。值;

您使用小写字母b表示getElementById会导致错误。要轻松查看此类错误，请启用保留登录chrome。在我的结尾，错误是：Uncaught TypeError：document.getElementbyId不是函数

防止页面发送错误添加返回false;在函数certifyDigits（）中。您还可以设置存储错误数量的变量，如果有错误，则返回false。

见下文。

function certifyDigits(){
    var fruits = ["blueberries", "cherries", "strawberries"];
    var errors_count = 0;

    for(var ctr = 0; ctr < fruits.length; ctr ++){
        if(! document.getElementById(fruits[ctr]).value.match(/^\d+$/)){
            errors_count++;
        }
    }

    if(errors_count > 0){
        alert("Please enter only numbers for quantity!");
        return false;
    }
  }

Answer 4

根据上下文，您使用匹配而不是测试。为了使一切正常，使用/^\d+$/.test(b)这将返回True或False，如果其中任何一个输入不正确（而不是三个警报），您可能想要提醒一次，为此包括|| in if语句代表或者干杯！

Javascript函数不显示警告框

4 个答案: