Javascript函数不显示警告框

Javascript function does not display alert box

本文关键字：警告 显示 函数 Javascript      更新时间：2023-09-26

我正在处理一个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>
javascript match（）函数总是返回一个数组。如果匹配为true，则数组将包含匹配值。如果匹配为false，那么数组将包含一个空字符串。将if语句更改为 
if (b.match(/^'d+$/)[0] === "") {

这应该可以解决问题。

为什么不只验证数字的输入？

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(); 
  }; 
};

它应该是：document.getElementById（"草莓"）.value；

不是：document.getElementbyId（"草莓"）.value；

您使用小写字母b表示getElementById，这会导致错误。要容易地看到这样的错误，请启用保留chrome日志。在我这边，错误是：未捕获类型错误：document.getElementbyId不是函数

为了防止页面发送错误，添加return 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;
    }
  }

根据上下文，您使用的是匹配而不是测试。为了使一切正常工作，请使用/^'d+$/.test(b)，这将返回True或False，如果其中一个输入不正确，您可能需要提醒一次（而不是三次提醒），为此，请将||包含在if语句中，该语句代表或，干杯！

相关文章：