Question

我正在为表单添加信用卡验证。

如果用户点击注册按钮并且没有有效的信用卡号，则会标记错误，标签将变为红色。

它还确保CVV字段和邮政编码字段不为空。

现在如果我在字段为空时单击按钮，我会根据需要收到错误。

如果我然后填写邮政编码和CSV并再次单击注册，则会删除错误。

但是没有删除CC号标志。

为什么会这样，我该如何解决？

代码如下，谢谢：

<div id="credit-card" class="credit-card">

  <div class="col-6 col">
    <label id="cc-numLbl" for="cc-num">Card Number:</label>
    <input id="cc-num" name="user_cc-num" type="text">
  </div>

  <div class="col-3 col">
    <label for="zip" id="zipLbl">Zip Code:</label>
    <input id="zip" name="user_zip" type="text"> 
  </div>

  <div class="col-3 col">
    <label id="cvvLbl" for="cvv">CVV:</label>
    <input id="cvv" name="user_cvv" type="text"> 
  </div>

  <label>Expiration Date:</label>
  <select id="exp-month" name="user_exp-month">
    <option value="1">1 - January</option>
    <option value="2">2 - February</option>
    <option value="3">3 - March</option>
    <option value="4">4 - April</option>
    <option value="5">5 - May</option>
    <option value="6">6 - June</option>
    <option value="7">7 - July</option>
    <option value="8">8 - August</option>
    <option value="9">9 - September</option>
    <option value="10">10 - October</option>
    <option value="11">11 - November</option> 
    <option value="12">12 - December</option>                       
  </select>  
  <select id="exp-year" name="user_exp-year">
    <option value="2016">2016</option>
    <option value="2017">2017</option>
    <option value="2018">2018</option>
    <option value="2019">2019</option>
    <option value="2020">2020</option>                      
  </select>                                
</div>

<button type="submit">Register</button>

和html：

{{1}}

Answer 1

似乎您正在尝试获取文本输入对象而不是其值。您需要将ccNum变量分配更改为

var ccNum = document.getElementById('cc-num').value;

querySelector函数在我的代码中失败了，我已将<input type="button"...>声明作为（为其添加了一个类属性），

<input type="button" class="button" id="myBtn" value="Validate" />

并将document.querySelector(...)功能更改为

document.querySelector(".button").addEventListener("click", function(e) {

工作演示：https://jsfiddle.net/nmvk9ks7/1/

希望这有帮助！

为什么我的信用卡验证无效？

1 个答案: