需要帮助简化验证

Need help simplyfying validation

本文关键字:验证 帮助      更新时间:2023-09-26

我需要帮助来简化/缩短以下验证代码。帮助将不胜感激。目前文字太多了,我的老师说可以做得更容易/更干净......我真的被困住了。

谢谢。

window.addEventListener('load',init,false);
function init(){
    var submit = document.getElementById("submit");
    var gender = document.getElementById("gender");
    var age = document.getElementById("age");
    var length = document.getElementById("length");
    var weight = document.getElementById("weight");
    var duration = document.getElementById("duration");
    var time = document.getElementById("time");
    submit.addEventListener('click', validation, false);
    gender.addEventListener('checked',validategender,false);
    age.addEventListener('blur', validateage, false);
    length.addEventListener('blur',validatelength,false);
    weight.addEventListener('blur',validateweight,false);
    duration.addEventListener('blur',validateduration,false);
    time.addEventListener('checked',validatetime,false);
}
function validategender(){
    var man = document.getElementById("man");
    var vrouw = document.getElementById("vrouw");
    var genderfout = document.getElementById("genderFout");
    if(man.checked != true && vrouw.checked !=true){
        genderfout.innerHTML = "Please choose a gender";
        return false;
    }else {
        genderfout.innerHTML = "";
    }return true;
}
function validateage() {
    var age = parseInt(document.getElementById("age").value, 10);
    var ageFout = document.getElementById("ageFout");
    if (isNaN(age) || age < 0 || age > 130) {
        ageFout.innerHTML = "Please enter a valid age";
        return false;
    } else {
        ageFout.innerHTML = "";
    }
    return true;
}
function validateweight() {
    var weight = parseInt(document.getElementById("weight").value, 10);
    var weightFout = document.getElementById("weightFout");
    if (isNaN(weight) || weight < 30 || weight > 200) {
        weightFout.innerHTML = "Please enter a valid weight";
        return false;
    } else {
        weightFout.innerHTML = "";
    }
    return true;
}
function validatelength() {
    var length = parseInt(document.getElementById("length").value, 10);
    var lengthFout = document.getElementById("lengthFout");
    if (isNaN(length) || length < 50 || length > 220) {
        lengthFout.innerHTML = "Please enter a valid length";
        return false;
    } else {
        lengthFout.innerHTML = "";
    }
    return true;
}
function validateduration() {
    var duration = parseInt(document.getElementById("duration").value, 10);
    var durationFout = document.getElementById("durationFout");
    if (isNaN(duration) || duration < 0) {
        durationFout.innerHTML = "Please enter a valid time-duration";
        return false;
    } else {
        durationFout.innerHTML = "";
    }
    return true;
}
function validatetime(){
    var minutes = document.getElementById("minutes");
    var hours = document.getElementById("hours");
    var timeFout = document.getElementById("timeFout");
    if(minuten.checked !=true && uur.checked !=true){
        timeFout.innerHTML = "choose a time unit!";
        return false;
    }else {
        timeFout.innerHTML = "";
    }
    return true;
}
function validation(e){
    var genderOk = validategender();
    var ageOk = validateage();
    var weightOk = validateweight();
    var lengthOk = validatelength();
    var durationOk = validateduration();
    var timeOk = validatetime();
    if (!genderOk || !ageOk || !weightOk || !lengthOk ||  !durationOk || !timeOk){
        e.preventDefault();
    }
}

如果不允许 JQuery 则留下另一个选项

正则表达式

您可以验证,但需要一点阅读

使用 JQuery 验证器http://docs.jquery.com/Plugins/Validation

您的验证代码将减少到现在的一半,甚至可能更少。