Javascript onsubmit 不返回任何值，如真或假。表单无需验证即可提交

Question

我正在开发我最后一年的学校项目。现在我遇到了一个问题。onsubmit我的表单中的某些功能无法正常运行。

问题是：我正在验证表单中填写的详细信息。但是虽然使用innerHTML已经指出了错误getElementById，但表单仍然可以提交。如何阻止表单提交？

该函数不返回任何true或false值。我已经检查了代码。但我找不到错误。

我试图将函数更改validate()为window.validate = function()，它也不能很好地工作。我试图将验证函数更改为仅返回false. 表单仍在提交中。我尝试了事件，preventDefault但结果变成了我无法提交表单。

Javascript 部分

function check_location() {

    var user_address = document.getElementById("location");

    var user_address_mess = document.getElementById("addressvalidate");

    var checkaddress;

    if (user_address.value == "") {

        //.....

        return false;

    } else if (user_address.value.length <= 10) {

        //.....

        return false;

    } else {

        //....

        return true;

    }

}

function check_stime() {

    var starttime = document.getElementById("starttime");

    var mess_starttime = document.getElementById("mess_starttime");

    var check1;

    if (starttime != null) {

        if (starttime.value == "") {

            //...

            return false;

        }

        else if (starttime.value < "08:00" && starttime > "19:00") {

            //...

            return false;

        }

        else {

            //...

            return true;

        }

    }

}

function check_date() {

    today = new Date();

    today.setDate(today.getDate() + 14);

    var eventdate = document.getElementById("date").value;

    eventdate1 = new Date(eventdate);

    var mess_date = document.getElementById("mess_date");

    var check2;

    if (document.getElementById("checkdate") != null) {

        var checkdate = document.getElementById("checkdate").innerHTML;

    }

    if (eventdate != null) {

        if (eventdate.value == "") {

            //...

            return false;

        }

        else if (eventdate1 <= today) {

            //...

            return false;

        }

        else {

            //...

            return true;

        }

    }

}

Answer 1

您可以通过将代码更改为此来轻松解决此问题。<form id="myForm" onsubmit="event.preventDefault(); validate();">并将 validate() javascript 函数更改为此。&nbsp; &nbsp;function validate() {&nbsp; &nbsp; checkstime = check_stime();&nbsp; &nbsp; checketime = check_etime();&nbsp; &nbsp; checkdate = check_date();&nbsp; &nbsp; checklocation = check_location();&nbsp; &nbsp; if (checklocation == false || checkstime == false || checketime == false || checkdate == false) {&nbsp; &nbsp; &nbsp; &nbsp; return false;&nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; document.getElementById("myForm").submit();&nbsp; &nbsp; }}

Answer 2

单击提交按钮添加如下内容<button&nbsp;onclick="return&nbsp;validate()"&nbsp;style="margin-bottom:50px;"&nbsp;type="submit"&nbsp;id="submit"&nbsp;&nbsp;name&nbsp;=&nbsp;"addtocart"&nbsp;class&nbsp;=&nbsp;"btn&nbsp;btn-primary"><span&nbsp;class&nbsp;=&nbsp;"glyphicon&nbsp;glyphicon-floppy-disk"></span>&nbsp;Submit</button>在validate()函数中，如果你返回true它会提交，如果你返回false它不会提交表单，你可以在那里显示错误信息

Answer 3

删除所有提交行的表单标签中的所有内容，并简单地给它一个唯一的 id，按钮标签也是如此<form id ="my_form" action="/action_page.php">&nbsp; <button id="u_id">submit</button></form>然后在java脚本部分var form = document.getElementById("my_form");document.getElementById("u_id").addEventListener("click", function () {&nbsp; checkstime = check_stime();&nbsp; &nbsp; checketime = check_etime();&nbsp; &nbsp; checkdate = check_date();&nbsp; &nbsp; checklocation = check_location();&nbsp; &nbsp; if (checklocation == false || checkstime == false || checketime == false || checkdate == false) {&nbsp; &nbsp; &nbsp; &nbsp;//show error msg&nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; form .submit();&nbsp; &nbsp; }});