时间戳

首页 > 解决方案 > JavaScript HTML 验证功能仅在表单元素全部填满时有效

javascript - JavaScript HTML 验证功能仅在表单元素全部填满时有效

问题描述

我正在提交登录表单。我想要做的是在表格中有空白时发出警报。但是该功能仅在填写所有表格时才有效。这是 HTML 和 JS 代码。结果与使用onsubmitHTML 内部的结果相同，或者addEventListener("submit" function name)

HTML ：它基本上是一种用于登录/订购的表单。

<form id="registration" method="POST" onsubmit="return validate();" action="phplink">
  <p> <label for="custName">Name : </label>
  <input type="text" id="cname" name="cname" required="required" /> </p>
</form>

JS：

function validate(event) {
    event.preventDefault();
    
    var r = document.getElementById("registration");
    var cname = r.cname.value;
    var errMsg = "";

    if (cname == "") {
        errMsg += "Please enter your Name.\n";
    }

    if (errMsg.length != 0) {
        alert(errMsg);
        result = false;
    }

    return result;
}

标签： javascripthtmlsubmit

解决方案

您好，您有几个问题。on submit 必须通过 event => onsubmit="return validate(event);" . 您必须首先定义结果，这就是您的标志 => var result = false。如果要显示警报，则输入不需要必需的属性。

所以这是你的固定代码；

function validate(event) {
        event.preventDefault();
        var result = true;
        var r = document.getElementById("registration");
        var cname = r.cname.value;
        var errMsg = "";
  
        if (cname == "") {
            errMsg += "Please enter your Name.\n";
        }

        if (errMsg.length != 0) {
            alert(errMsg);
            result = false;
        }

        return result;
        }

推荐阅读