Javascript onsubmit不会返回任何值，如true或false。表格无需验证即可提交

我正在进行我最后一年的学校项目。现在我面临一个问题。我表单中的一些

onsubmit

函数运行不正常

问题是： 我正在验证表单中填写的详细信息。但是，尽管

innerHTML

已经通过使用

getElementById

指出了错误，表单仍然可以提交。如何阻止表单提交

该函数不返回任何

true

或

false

值。 我已经查过密码了。但是我找不到错误

我试图将函数

validate（）

更改为

window.validate=function（）

，但也无法正常工作。 我试图将validate函数更改为仅返回

false

。表格仍在提交中。 我尝试了event

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;
        }
    }
}

function check_etime() {

    var starttime = document.getElementById("starttime");
    var endtime = document.getElementById("endtime");
    var mess_endtime = document.getElementById("mess_endtime");
    var eventdate = document.getElementById("eventdate");
    var check3;

    if (endtime != null) {
        if (endtime.value == "") {
           // ...
            return false;
        }
        else if (endtime.value == starttime.value || endtime.value <= starttime.value) {
           // ...
            return false;
        }
        else if (endtime.value <= starttime.value && eventdate.value <= fulldate) {
           // ...
            return false;
        }
        else if (endtime.value < "09:00" && endtime.value > "22.00pm") {
           // ...
            return false;
        }
        else {
            //...
            return true;
        }
    }
}

function validate() {

    checkstime = check_stime();
    checketime = check_etime();
    checkdate = check_date();
    checklocation = check_location();

    if (checklocation == false || checkstime == false || checketime == false || checkdate == false) {
        return false;
    } else {
        return true;
    }
}

<div class="g-text-center--xs g-margin-b-40--xs">
    <h2 class="g-font-size-30--xs g-color--black">Booking Form</h2>
</div>

<br>
<form autocomplete="off" name="form_submit" onsubmit=" return validate();" method="post" action="">
    <div class="g-margin-b-30--xs">
        <p><b>Package Name :</b>
            <input type="text" name="pname" class="form-control s-form-v3__input g-bg-color--white-opacity-lightest" value="<?php echo $pack1['package_name']?>" style="width:200px; font-weight:bold; color:black;" disabled>
        </p>
    </div>

    <div class="g-margin-b-30--xs">
        <p><b>Package Price :</b>
            <input type="text" name="pprice" class="form-control s-form-v3__input g-bg-color--white-opacity-lightest" value="RM <?php echo $pack1['package_price']?>" style="width:200px; font-weight:bold; color:black;" disabled>
        </p>
    </div>

    <div class="g-margin-b-30--xs">
        <b>Event Date :</b>
        <input onfocusout="check_date()" name="date" id="date" type="date" class="form-control s-form-v3__input g-bg-color--white-opacity-lightest" style="width:400px;  color:black;">
        <span id="mess_date" style="color:red;font-weight:normal;"></span>
    </div>

    <div class="g-margin-b-30--xs">
        <b>Start Time :</b>

        <input onfocusout="check_stime()" name="starttime" id="starttime" type="time" class="form-control s-form-v3__input g-bg-color--white-opacity-lightest" style="width:500px;" />
        <span id="mess_starttime" style="color:red;font-weight:normal;"></span>
    </div>

    <div class="g-margin-b-30--xs">
        <b>End Time :</b>
        <input onfocusout="check_etime()" name="endtime" id="endtime" type="time" class="form-control s-form-v3__input g-bg-color--white-opacity-lightest" style="width:500px;" />
        <span id="mess_endtime" style="color:red;font-weight:normal;"></span>
    </div>

    <b>Event Location :  </b>
    <br>
    <textarea class="form-control s-form-v2__input" name="location" id="location" style=" width:500px; font-weight:bold; text-align:left;" onfocusout="check_location()"></textarea>

    <span style="color:red;font-weight:normal;" id="addressvalidate"></span>

    <div class="g-text-center--xs">
        <br>

        <button style="margin-bottom:50px;" type="submit" id="submit" name="addtocart" class="btn btn-primary"><span class="glyphicon glyphicon-floppy-disk"></span> Submit</button>
        <div class="clearfix"> </div>
    </div>

</form>

功能检查位置（）{
var user_address=document.getElementById（“位置”）；
var user_address_mess=document.getElementById（“addressvalidate”）；
var校验地址；
if（user_address.value==“”）{
//.....
返回false；
}else if（user_address.value.length“19:00”）{
//...
返回false；
}
否则{
//...
返回true；
}
}
}
函数检查_日期（）{
今天=新日期（）；
today.setDate（today.getDate（）+14）；
var eventdate=document.getElementById（“日期”）.value；
eventdate1=新日期（eventdate）；
var mess_date=document.getElementById（“mess_date”）；
var检验2；
if（document.getElementById（“checkdate”）！=null）{
var checkdate=document.getElementById（“checkdate”）.innerHTML；
}
if（eventdate！=null）{
如果（eventdate.value==“”）{
//...
返回false；
}
else if（eventdate1单击submit按钮添加如下内容

<button onclick="return validate()" style="margin-bottom:50px;" type="submit" id="submit"  name = "addtocart" class = "btn btn-primary"><span class = "glyphicon glyphicon-floppy-disk"></span> Submit</button>

提交

在validate（）函数中，如果您返回true，它将提交，如果您返回false，它将不提交表单，您可以在那里显示错误消息
您可以通过将代码更改为此来轻松修复此问题

<form id="myForm" onsubmit="event.preventDefault(); validate();">

删除表单标签中的所有内容所有提交行，只需给它一个唯一的id，按钮标签也是如此

<form id ="my_form" action="/action_page.php">
  <button id="u_id">submit</button>
</form>

您的htmlif中缺少
开始标记。如果您需要停止提交，您可以在提交事件中使用此标记。我尝试了此操作。但仍然相同。我可以提交表单。显示了错误。我只是不知道为什么validate（）不返回false我确实尝试过这个。但是这导致我的表单无法提交，尽管已经没有显示错误。哦，好的。等等，我会用小改动更新答案。这个@TanYeeFanThanks供您评论！我尝试过了。但是这使得我的表单在我单击提交按钮时没有响应谢谢！但是我已经完成了这个代码。我不能再订阅了在没有错误时提交表单您可以将函数返回的值存储在变量中，如果它返回true，则可以提交。如果没有帮助，我可以提供另一个ajax代码，如果您愿意，请告诉我？我现在找不到解决我问题的其他解决方案。我正在更新我的答案。尝试此操作肯定可以检查函数Form（）{if（check|stime（）==false | | check|etime（）==false | | checkdate（）==false | | checklocation（）==false）{return false；}否则{return true；}
<form id ="my_form" action="/action_page.php">
  <button id="u_id">submit</button>
</form>

var form = document.getElementById("my_form");

document.getElementById("u_id").addEventListener("click", function () {
  checkstime = check_stime();
    checketime = check_etime();
    checkdate = check_date();
    checklocation = check_location();

    if (checklocation == false || checkstime == false || checketime == false || checkdate == false) {
       //show error msg
    } else {
        form .submit();
    }
});