javascript - Google 电子表格网站表单 jQuery 脚本阻止发送

Question

我有 html 格式的表单。我从原始 Google 表单复制了操作、输入键和隐藏输入。

<form id="Gform" role="form" action="https://docs.google.com/forms/d/MY-FORM-KEY/formResponse" method="POST" target="_self" onsubmit="">
                <input type="text" pattern="^[a-zA-Z][a-zA-ZążźćśęółbńĄŻŹĆŃŚĘÓŁ ]{4,40}$" name="entry.1028663680" value="" id="entry.1028663680" dir="auto" title="What is Your city" class="form-control" placeholder="City" required>
                <input type="text" pattern="^[a-zA-Z][a-zA-ZążźćśęółbńĄŻŹĆŃŚĘÓŁ ]{5,40}$" name="entry.1220908348" value="" id="entry.1220908348" dir="auto" title="Your complete name" class="form-control" placeholder="Your name" required>
                <input type="tel" name="entry.623688995" value="" id="entry.623688995" dir="auto" title="" class="form-control" placeholder="phone" required>
                <input type="email" name="entry.1564973803" value="" id="entry.1564973803" dir="auto" title="" class="form-control" placeholder="email" required>
                <input type="hidden" name="entry.383122401" value="WEBSITE" id="entry.383122401" dir="auto" title="" class="form-control" placeholder="E-mail" required>
                <input type="hidden" name="draftResponse" value="[,,&quot;-9139933475238999509&quot;]
">
<input type="hidden" name="pageHistory" value="0">
<input type="hidden" name="fbzx" value="-9139933475238999509">
                <button type="submit" name="submit" id="sendData" class="btn btn-default">Submit</button>
            </form>

我有 te jQuery 脚本，它显示确认:

    <script type="text/javascript">
    function sendContactForm(){
                $("#Gform").fadeOut();
                $("#form-container").append('<p class="confirmer">Thanks!<br>Your email was sent.</p>');
           };
$('#Gform').submit(function () {
 sendContactForm();
 return false;
});
</script>

当我删除这个脚本时，表单正在发送，并保存到谷歌，但在点击提交后，我重定向到谷歌“谢谢”页面。我不想重定向并显示确认

就像在脚本中一样。如何解决这个问题？

Answer 1

尝试使用 AJAX 来完成您的任务，当您使用异步函数时，不会重新加载页面，您将在后台发送数据。在数据对象中输入所有输入值，在 done() 和 fail() 函数中定义收到响应时要执行的操作。祝你好运:)

$('#formID').submit(function(e){
   e.preventDefault();
   $.ajax({
      url: "https://docs.google.com/forms/d/1PrgHQALlz0WrvwjhGpLrtIgD5aQ1x-8HrOubkxTLNKs/formResponse",
      type: "POST",
      data: {
         'entry.111':     $('#entry_111').val(),
         'entry.222': $('#entry_222').val(),
        // all data from form
      }
   }).done(function(data){
      yourAction(data);
   }).fail(function(data){
      failAction(data);
   });
});