Question

我有一个表单，不幸的是在没有外部库的帮助下构建它（我现在诅咒自己不包括在内）。所以我的表单验证不仅仅是form.validate（）或类似的东西，它必须是一个古老的javascript方法（时间限制意味着我无法实现外部库，因为它涉及重建表单）。

我想要的只是检查所有已填写的字段 - 没有电子邮件验证或后代码验证等。

我尝试了一个简单的版本：

if((document.getElementById("fieldA").value != "") || (document.getElementById("fieldB").value != "")){
   alert("form okay");
}else{
   alert("form not okay");
}

但这不起作用。替代方案是嵌套45 if语句单独检测每个字段，但这很乏味且不可行。

Answer 1

您可以使用

循环遍历表单中的元素

document.forms[0].elements

喜欢

 var d = document.forms[0].elements
 var l = d.length;
 for(var i = 0; i < l; i ++) {
     var element = d[i];
     var type = element.type;
     var value = element.value;
     var class = element.className;
 }

下拉：

document.forms[0].select.value

单选按钮：

for (i=0;i<document.forms[0].radios.length;i++) {
    if (document.forms[0].radios[i].checked) {
        var value = document.forms[0].radios[i].value;
    }
}

thanks to external libraries we don't need that to do ourselves these days;）

Answer 2

您的布尔逻辑错误 - 如果您想要所有所需的字段，您希望AND（&&）不是OR（||）。目前，验证仅检查一个字段是否已填写。

Answer 3

我认为卡斯帕的答案非常好。作为对它的补充，我们在旧表单上的功能是按类名获取元素的功能（不是由我们编写的）：

function getElementsByClassName(className, tag, elm){
    var testClass = new RegExp("(^|\\s)" + className + "(\\s|$)");
    var tag = tag || "*";
    var elm = elm || document;
    var elements = (tag == "*" && elm.all)? elm.all : elm.getElementsByTagName(tag);
    var returnElements = [];
    var current;
    var length = elements.length;
    for(var i=0; i<length; i++){
            current = elements[i];
            if(testClass.test(current.className)){
                    returnElements.push(current);
            }
    }
    return returnElements;
}

然后我们在需要验证的每个表单元素上放置一个class =“validate”，并在表单提交上运行此函数（其中getFormElementValue是一个处理各种不同表单元素的函数，如Caspar的答案）：

function validate(){
    var elementArray = ( getElementsByClassName('validate') ) ;
    for ( i=0; i<elementArray.length;  i++){
        if( getFormElementValue( elementArray[i] ) == '' ){
            alert( 'Form not OK' );
            return false;
        }
    }
}

关于这一点的好处在于，您可以轻松定义哪些元素是强制性的，哪些元素不是没有使用名称/ ID列表。

古老的表格验证

3 个答案: