Question

我有一个表单，在页面加载时禁用提交按钮。

window.onload=function()
{
    document.getElementById('form_submit').disabled = true;
}

当为空或不正确的字段时，以下类将添加到输入字段：

if(document.getElementById('thickness').value == false)
{
    document.getElementById('div_thickness').className = "form-group has-warning";
}
else if(document.getElementById('thickness').value > 1 && document.getElementById('thickness').value < 7)
{
    document.getElementById('div_thickness').className = "form-group has-success";
}
else
{
    document.getElementById('div_thickness').className = "form-group has-error";
}

删除所有错误或警告类后，应再次启用提交但按钮保持禁用状态。我错过了什么冲突吗？

if(document.getElementsByClassName('has-error') || document.getElementsByClassName('has-warning'))
{
    document.getElementById('form_submit').disabled = true;
}
else
{
    document.getElementById('form_submit').disabled = false;
}

Answer 1

当你查询元素时，会返回一个空数组，所以有一些东西。您需要检查数组长度：

if(document.getElementsByClassName('has-error').length > 0 || document.getElementsByClassName('has-warning').length > 0)

Answer 2

＆＃13;

    else if(document.getElementById('thickness').value > 1 && document.getElementById('thickness').value < 7)
    {
        document.getElementById('div_thickness').className = "form-group has-success";
    if(document.getElementById("#div_thikness").classList.contain('form-group has-error'){
    $document.getElementById('#div_thickness).classList.remove('has-error);
    }
 if(document.getElementById("#div_thikness").classList.contain('form-group has-warning'){
    $document.getElementById('#div_thickness).classList.remove('has-warning);
    }
    }

＆＃13;

在成功时更新上述代码，必须删除has-warning和has-error类，不仅要添加has-success。

删除类后启用表单提交按钮

2 个答案: