Ajax在JQuery中提交表单两次

时间:2016-03-02 00:30:13

标签: jquery html ajax

编辑:已解决

我知道这是一个非常常见的问题,但是我已经查看了答案 - preventDefault和stopImmediatePropagation似乎没有工作,所以我想我发布了我的代码。问题是这个问题的标题 - 我有一个表单,我使用Ajax提交,以便页面不会重新加载。看起来该页面实际上并没有重新加载,一切顺利,但如果我在提交帖子一段时间后将浏览器留在页面上,它会再次通过。这是我的代码 -

html表格:

<form action="" id="ask" name='<%= pathName %>' method="POST" enctype="application/x-www-form-urlencoded">
  <p>Ask an Expert</p>
  <p style="display: none;" id="error">Please enter valid information</p>

  <label>Email  
    <input type="text" name="email" id="email">
  </label>
  <label>Question
    <textarea name="question" rows="4" id="question"></textarea>
  </label>
  <input value="<%= email %>" name="expEmail" style="display:none">
  <input value="<%= title %>" name="subject" style="display:none">
  <input type="submit" class="button" value="Send" />
</form>

JQuery的:

$("#ask").on('submit',function(e) {

    function validateEmail(email) {
        var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
        return re.test(email);
    }

    if (validateEmail($('#email').val()) && ($('#question').val() !== '')) {
        document.getElementById('ask').style.display='none'
        document.getElementById('emailSent').style.display='initial'
    } else {
        document.getElementById('error').style.display='initial'
        return false;
    }

    e.preventDefault();
    e.stopImmediatePropagation();

    var path = 'http://localhost:3000/page/' + $('#ask').attr('name');

    $.ajax({
        type: "POST",
        url: path,
        data: $("#ask").serialize(),
        success: function (data) {
            $("#form_output").html(data);
        }
    });

    return false;

});

非常感谢任何帮助或建议。重申:第二次提交仅在我停留在页面上一段时间。谢谢!

1 个答案:

答案 0 :(得分:0)

我发现了我的问题,它是服务器端 - &gt;我的服务器没有设置为实际发送对post请求的响应,并且以某种方式(这是处理它的典型方式吗?)Ajax通过第二次提交请求做出反应。将响应添加到服务器,现在它可以正常工作。