Javascript Jquery/php表单必须点击提交两次为什么？

我有一个使用jquery和php的简单表单

每当有人点击提交按钮时，他们必须点击两次

这是我的jQuery

    $('#submit_btn').on('click', function(){
      var post_data, proceed, user_email, user_message, user_name, user_phone;

      user_name = $("input[name=name]").val();
      user_email = $("input[name=email]").val();
      user_phone = $("input[name=phone]").val();
      user_message = $("textarea[name=message]").val();
      proceed = true;
      if (user_name === "") {
        $("input[name=name]").css("border-color", "red");
        proceed = false;
      }
      if (user_email === "") {
        $("input[name=email]").css("border-color", "red");
        proceed = false;
      }
      if (user_phone === "") {
        $("input[name=phone]").css("border-color", "red");
        proceed = false;
      }
      if (user_message === "") {
        $("textarea[name=message]").css("border-color", "red");
        proceed = false;
      }
      if (proceed) {
        post_data = {
          userName: user_name,
          userEmail: user_email,
          userPhone: user_phone,
          userMessage: user_message
        };
        $.post("contact_me_test.php", post_data, (function(response) {
          var output;
          if (response.type === "error") {
            output = "<div class=\"error\">" + response.text + "</div>";
          } else {
            output = "<div class=\"success\">" + response.text + "</div>";
            $('#contact-form-container').fadeOut(function(e){
              $('#form-success-message').fadeIn();
            });
            $("#contact_form input").val("");
            $("#contact_form textarea").val("");
          }
          $("#result").hide().html(output).slideDown();
        }), "json");
      }
    });

这是我的jQuery

    $('#submit_btn').on('click', function(){
      var post_data, proceed, user_email, user_message, user_name, user_phone;

      user_name = $("input[name=name]").val();
      user_email = $("input[name=email]").val();
      user_phone = $("input[name=phone]").val();
      user_message = $("textarea[name=message]").val();
      proceed = true;
      if (user_name === "") {
        $("input[name=name]").css("border-color", "red");
        proceed = false;
      }
      if (user_email === "") {
        $("input[name=email]").css("border-color", "red");
        proceed = false;
      }
      if (user_phone === "") {
        $("input[name=phone]").css("border-color", "red");
        proceed = false;
      }
      if (user_message === "") {
        $("textarea[name=message]").css("border-color", "red");
        proceed = false;
      }
      if (proceed) {
        post_data = {
          userName: user_name,
          userEmail: user_email,
          userPhone: user_phone,
          userMessage: user_message
        };
        $.post("contact_me_test.php", post_data, (function(response) {
          var output;
          if (response.type === "error") {
            output = "<div class=\"error\">" + response.text + "</div>";
          } else {
            output = "<div class=\"success\">" + response.text + "</div>";
            $('#contact-form-container').fadeOut(function(e){
              $('#form-success-message').fadeIn();
            });
            $("#contact_form input").val("");
            $("#contact_form textarea").val("");
          }
          $("#result").hide().html(output).slideDown();
        }), "json");
      }
    });

这里有什么东西需要按两次吗？我在网上看了几个小时，有些人说你需要取消验证，但我试过了，我得到了同样的结果

表单的所有功能都正常。唯一的问题是您必须单击两次，然后尝试使用以下代码：

$('#submit_btn').on('click', function(evt){
  evt.preventDefault();
  ... //Rest of code 
}

---

我想知道返回false或e.preventDefault在哪里。@DOCASAREL很抱歉，我后来添加了这些内容，试图根据我在网上读到的内容来解决问题。可能是按钮的默认操作有问题？尝试在函数中传递事件并阻止默认值。preventDefault似乎不是问题，因为如果是问题，页面将重定向到目标，而事实并非如此！你们可以在urbanfutsal.la/free_agents.htmlc上查看表格，你能给我举个例子说明你是如何做到的吗