我如何修复我的表单验证

how can I fix my form validation

本文关键字:表单 验证 我的 何修复      更新时间:2023-09-26

我有一个问题与我的代码,我会很感激,如果你帮助我。问题是-当你正确填写表单中的所有输入时,脚本从提交按钮中删除属性"disabled",但例如,如果你在填写表单后清除所有字段,提交按钮将能够提交表单,但它必须返回属性"disable"。我怎样才能修好它?

//validation name
        document.callbackform.name.onkeyup = function() {
            var name = document.callbackform.name.value;
            if (name === "") {
                document.callbackform.name.removeAttribute("class", "ready");
                document.getElementById("callError").style.display = "block";
                document.getElementById("calllErrorTwo").style.display = "none";
            } else {
                    document.getElementById("callError").style.display = "none";
                    var pattern = new RegExp("^[а-я]+$", "i");
                    var isValid = this.value.search(pattern) >= 0;
                    if (!(isValid)) {
                        document.getElementById("calllErrorTwo").style.display = "block";
                        document.callbackform.name.removeAttribute("class", "ready");
                    } else {
                        document.getElementById("calllErrorTwo").style.display = "none";
                        document.callbackform.name.setAttribute("class", "ready");
                    }
            }
        };
        //validation phone
        document.callbackform.phone.onkeyup = function() {
            var name = document.callbackform.phone.value;
            if (name === "") {
                document.callbackform.phone.removeAttribute("class", "ready");
                document.getElementById("calltelError").style.display = "block";
                document.getElementById("calltelErrorTwo").style.display = "none";
            } else {
                    document.getElementById("calltelError").style.display = "none";
                    var pattern = new RegExp("[- +()0-9]+");
                    var isValid = this.value.search(pattern) >= 0;
                    if (!(isValid)) {
                        document.getElementById("calltelErrorTwo").style.display = "block";
                    } else {
                        document.getElementById("calltelErrorTwo").style.display = "none";
                        document.callbackform.phone.setAttribute("class", "ready");
                    }
                }
        };
        //filling the form
        document.callbackform.onkeyup = function() {
            var a = document.callbackform.name.getAttribute("class");
            var c = document.callbackform.phone.getAttribute("class");
            if (a === "ready" && c === "ready") {
                document.getElementById("subCallback").removeAttribute("disabled");
                document.getElementById("subCallback").style.cursor = "pointer";
            } else {
                document.getElementById("subCallback").setAttribute("disabled");
                document.getElementById("subCallback").style.cursor = "not-allowed";
            }
        };   

简单修复。.setAttribute("disabled");不起作用,因为disabled是一个属性,而不是一个属性,因为它没有值。您只需要使用.disabled = true;,如下所示:

document.getElementById("subCallback").disabled = true;

还可以使用以下命令来删除disabled属性:

document.getElementById("subCallback").disabled = false;

.

请记住,setAttribute()总是需要两个参数,第二个参数是属性值。