JavaScript信用卡验证

Question

我目前正在为学校做一些家庭作业，而我对开关的兴趣却很少！

我正在响应直到checkcard(); alert(card) checkcard(); 我的问题是，所有这些案例都不会真正验证所引用的卡的类型，不允许使用jQuery等附加组件。我将发布相关代码，并很高兴听到你们的消息： D为了方便起见，我用####注释了这些行。 此外， getcard确实会返回所需的正确卡类型。

    function getCard(){
    var cardType = "unknown";
    var cardTypeArray = document.getElementById("chooseCard").getElementsByTagName("input");


    for(var i = 0; i < cardTypeArray.length; i++){
        if (cardTypeArray[i].checked) { 
            cardType = cardTypeArray[i].value;  
        }
    }
    alert ("cardtype is" + cardType);
    return cardType;

}
function checkCard(cardNumber){
    var errMsg = "";
    var card = getCard(); 
    //var cardNumber = document.getElementById("cardNumber").value;
    var regVisa = /^4[0-9]{12}(?:[0-9]{3})?$/;
    var regMaster = /^5[1-5][0-9]{14}$/;
    var regAmerica = /^3[47][0-9]{13}$/;
    alert(card); // works till here #######

    switch(card){
        case "Visa":
            if (parseInt(cardNumber.substring(0,1)!=4) {
                errMsg = "card number is not visa \n";
            }
            break;
        case "Mastercard":
            if (cardNumber.substring(0,1) !=5) {
                errMsg = "card number is not mastercard. \n";
            }
        break;
        case "AmericanExpress":
            if (cardNumber.substring(0,2) !=51) {
                errMsg = "card number not american express, \n";
            }
            break;


    }
    return errMsg;


}
function validator(){

    var errMsg = "";                                /* stores the error message */
    var result = true;  
    var visaCard = document.getElementById("visa").checked;
    var masterCard = document.getElementById("mastercard").checked;
    var americanExpress = document.getElementById("americanExpress").checked;
    var cardName = document.getElementById("cardName").value;
    //document.getElementById("cardName").setAttribute('maxlength',40);
    var regexAlpha = /^[a-zA-Z ]+$/;
    var cardNumber = document.getElementById("cardNumber").value;
    var regexNum =  /^[0-9]+$/;
    var date = new Date();
    var todayDateMonth = date.getMonth() + 1;
    var todayDateYear = date.getFullYear();
    var expMonth = document.getElementById("expMonth").value;
    var expYear = document.getElementById("expYear").value;
    var regVisa = /^4[0-9]{12}(?:[0-9]{3})?$/;
    var regMaster = /^5[1-5][0-9]{14}$/;
    var regAmerica = /^3[47][0-9]{13}$/;


    if (todayDateMonth > expMonth || todayDateYear > expYear){
        errMsg += "expiry date is wrong\n";
        result = false;
    }

    if (!(visaCard || masterCard || americanExpress)){
        errMsg += "please select visa, mastercard or american express\n";
        result = false;
    }   /* assumes no errors */


    if (cardNumber.length > 16 || cardNumber.length < 15 )
    {
        errMsg = errMsg + "your card number can only contain 15 to 16 digits \n";
        result = false;
    }else{
        checkCard(cardNumber); // Starts here #######

    }






    if (cardName.length > 40 || cardName.length < 1 || !regexAlpha.test(cardName))
    {
        errMsg = errMsg + "your card name must only contain alpha characters \n";
        result = false;
    }
    if (errMsg != "") {
        alert(errMsg);
    }
    return result;    //if false the information will not be sent to the server
}

function init() {
    if(document.getElementById("regform")!==null){
    var regForm = document.getElementById("regform");// get ref to the HTML element
    regForm.onsubmit = validate;    
    prefill_form();
}
    if(document.getElementById("bookform") !=null){
    var bookForm = document.getElementById("bookform");
    bookForm.onsubmit = validator;          /* assigns functions to corresponding events */
    var cancel = document.getElementById("cancelButton");
    cancel.onclick = cancelBooking;
    getBooking();

    }

}

Answer 1

问题出在我的代码结构上。 您在交换机内部有一个if条件，而没有其他任何关联。 在没有太多测试条件知识的情况下，我有充分的理由相信您没有正确处理案例和条件。 查找代码错误之处的简单方法是放置debugger; 您的代码中的语句。 打开您的开发人员工具，您可以通过在大多数浏览器中按F12或仅从右键单击选项来执行此操作。 它应该在那里暂停代码的执行。 然后，您将看到两个按钮。 1.播放按钮，可立即恢复执行代码。 2.一种弯曲的箭头，这很重要，您可以与此箭头逐行执行代码，并查看通过了哪些条件以及实际执行了代码的哪一部分。 想要对此发表评论，但太长了以至于无法容纳。 如果您在调试时遇到问题，请随时在此处评论。如果您无法打开特定窗口，则可以使用Google 开发人员工具 。

Answer 2

好的，所以问题是我没有返回错误消息或错误的结果。 会重新发布与以前相同的代码，但是我添加了一些代码使其对那些感兴趣的人有用。 感谢您的反馈！ 我将在船上谈几点。 无论如何，代码都在下面，请查找####################。

function validator(){

var errMsg = "";                                
var result = true;  


var visaCard = document.getElementById("visa").checked;
var masterCard = document.getElementById("mastercard").checked;
var americanExpress = document.getElementById("americanExpress").checked;
var cardName = document.getElementById("cardName").value;

var regexAlpha = /^[a-zA-Z ]+$/;
var cardNumber = document.getElementById("cardNumber").value;
var regexNum =  /^[0-9]+$/;
var date = new Date();
var todayDateMonth = date.getMonth() + 1;
var todayDateYear = date.getFullYear();
var expDate = document.getElementById("expDate").value;
var dateFormat = /^[\d]{2}\/[\d]{4}$/;





if (!dateFormat.test(expDate)){
    errMsg += "please select a valid date range\n";
    result = false;
}else if (todayDateYear > expDate.substring(3,7)){
    errMsg += "please select a valid expiry year\n";
    result = false;
} else if (todayDateYear == expDate.substring(3,7) && todayDateMonth > expDate.substring(0,2)){
    errMsg += "please select a valid expiry month\n";
    result = false;
}




if (!(visaCard || masterCard || americanExpress)){
    errMsg += "please select visa, mastercard or american express\n";
    result = false;
}   


if (cardNumber.length > 16 || cardNumber.length < 15 )
{
    errMsg = errMsg + "your card number can only contain 15 to 16 digits \n";
    result = false;
}else{
    // code below is what i added ######################################
    var tempMsg = checkCard(cardNumber);
    if (tempMsg != "") {
        errMsg = errMsg + tempMsg;
        result = false;
    };

} 







if (cardName.length > 40 || cardName.length < 1 || !regexAlpha.test(cardName))
{
    errMsg = errMsg + "your card name must only contain alpha characters \n";
    result = false;
}
if (errMsg != "") {
    alert(errMsg);
}
return result;    //if false the information will not be sent to the server

}

function checkCard(cardNumber){
var errMsg = "";
var card = getCard(); 
var cvv = document.getElementById("CVV").value;
var regVisa = /^4[0-9]{12}(?:[0-9]{3})?$/;
var regMaster = /^5[1-5][0-9]{14}$/;
var regAmerica = /^3[47][0-9]{13}$/;
var cvvCheck3 =/^[0-9]{3}$/;
var cvvCheck4 =/^[0-9]{4}$/;




//do with if else 
switch(card){
    case "Visa":
        if (!regVisa.test(cardNumber) || !cvvCheck3.test(cvv)) {
            errMsg = "card number is not visa or cvv is wrrong \n";
        }
        break;
    case "Mastercard":
        if (!regMaster.test(cardNumber)  || !cvvCheck3.test(cvv)) {
            errMsg = "card number is not mastercard or cvv is wrong\n";
        }
    break;
    case "AmericanExpress":
        if (!regAmerica.test(cardNumber) || !cvvCheck4.test(cvv)) {
            errMsg = "card number not american express or cvv is wrong, \n";
        }
        break;
        default: 
        errMsg = "we cant process this card number \n";
}
return errMsg;  

}