onsubmit不允许发送操作的问题

时间:2018-10-17 16:43:53

标签: javascript html

我有一个运行脚本的html表单,该脚本检查输入是否为空,如果为空,它将不提交并发送警报。但是,当输入正确时,我希望它进入我的contact.php操作。它正在正确运行脚本,但未激活或将数据发送到我的contact.php。它可以正确运行脚本,但只能运行脚本。

index.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
    </head>
    <body>
        <script src="form.js"></script>
        <form name="Form" onsubmit="return formValidate(event)" action="contact.php" method="post">
            <label>Name:<span id="label_name"></span></label>
            <input type="text" id="name" name="name"><br/>
            <label >Email:<span id="label_email"></span></label>
            <input type="text" id="email" name="email"><br/>
            <label >Subject:<span id="label_subject"></span></label>
            <input type="text" id="subject" name="subject"><br/>
            <label >Email:<span id="label_message"></span></label>
            <input type="text" id="message" name="message"><br/>
            <button type="submit" name="submit">Submit</button>
        </form>
    </body>
</html>

form.js

function formValidate(event) {
    event.preventDefault();
    var name = document.forms["Form"]["name"].value;
    var email = document.forms["Form"]["email"].value;
    var subject = document.forms["Form"]["subject"].value;
    var message = document.forms["Form"]["message"].value;
    if (name == "" || email == "" || subject == "" || message == "") {
      output = "*";
      alert('Fill out all required inputs');
      return false;
    } else {
        alert('Thanks for contacting me!')
    }
    return true;
    document.getElementById("label_name").innerHTML = output;
    document.getElementById("label_email").innerHTML = output;
    document.getElementById("label_subject").innerHTML = output;
    document.getElementById("label_message").innerHTML = output;
  }

1 个答案:

答案 0 :(得分:0)

根据您的条件来决定是否呼叫return true/false,而不是event.preventDefault。我认为您返回的内容实际上并不重要。

通常,人们将其写为第一行是因为他们将以不同的方式提交数据,例如AJAX。如果您要进行正常的整页提交,那么您就不想阻止正常的提交行为。