Question

我正在为他们正在举办的活动的客户创建一个注册表单。基本用户详细信息将提交给第三方系统（即姓名，电子邮件等），但其余字段需要通过电子邮件发送给客户。

我需要这样的事情发生：

列表项
用户填写表格
jquery bvalidator检查表单中的必填字段
表单（通过ajax）提交到单独的页面，其中电子邮件发送到客户端
表单（常规POST方法）提交给第三方系统
成功用户将被传递回'谢谢'网址。

以下是我尝试使用过的代码，但它会在循环中被反复提交到“电子邮件”页面，并且永远不会提交到外部网址。

如果我用警告替换$('#form1').submit();，它只向电子邮件页面提交一次，然后正确显示警告。

var myvalidator = $('#form1').bValidator(optionsGrey);

$('#form1').submit(function() {
  if (myvalidator.isValid()) {

    $.ajax({
      data: $('#form1').serialize(),
      type: "POST",
      url: "email_send.asp",
      success: function() {
        $('#form1').submit();
      }
    });
  }
  return false;
});

有关如何解决这个问题的任何建议吗？

Answer 1

尝试：


$('#form1').unbind('submit').submit();

Answer 2

通过调用unbind

尝试解除对成功的绑定提交事件：ajax调用的方法

$('#form1').unbind('submit'); 
$('#form1')[0].submit(); // call native submit

http://api.jquery.com/unbind/

Answer 3

您可以使用unbind（）恢复默认行为。

var myvalidator = $('#form1').bValidator(optionsGrey);

$('#form1').submit(function() {

    if(myvalidator.isValid()) {

        $.ajax({
            data: $('#form1').serialize(),
            type: "POST",
            url: "email_send.asp",
            success: function(){
                $('#form1').unbind('submit');
                $('#form1').submit();
            }
        });

    }

    return false;

});

Answer 4

是的，我不确定我理解。你总是提交给email_send.asp，所以每次成功都会这样做，所以看起来很清楚为什么你会陷入困境。

如果我理解你的话，第二次提交应该是另一个具有不同成功处理程序的URL，对吧？

因此，您不必再次提交表单，而只需编写基本的ajax函数：

$('#form1').submit(function () {
  if (myvalidator.isValid()) {
    $.ajax({
      data: $('#form1').serialize(),
      type: "POST",
      url: "email_send.asp",
      success: function(){
        $.ajax({
          data: $('#form1').serialize(),
          type: 'POST',
          url: 'third_party.asp',
          success: function () {
            //display thank you message
          }            
        });
      }
    });
  }    
});

编辑根据您的评论，这是一个更新的答案：

var myvalidator = $('#form1').bValidator(optionsGrey);

$('#form1').submit(function(){      
  if(myvalidator.isValid()){
    $.ajax({
      data: $('#form1').serialize(),
      type: "POST",
      url: "email_send.asp",
      success: function(){
        $('#form1').unbind('submit').submit();
      }
    });
  }
  return false;
});

Answer 5

您可以使用jquery.form插件通过ajax提交表单。结帐以下网址： http://jquery.malsup.com/form/

然后在你的js脚本中尝试这样的事情

var myvalidator = $('#form1').bValidator(optionsGrey);

$('#form1').submit(function(){
    if(myvalidator.isValid()){
      $(this).unbind('submit').submit();

});

Answer 6

您是否有理由必须使用submit方法？它进入无限循环的原因是因为它再次调用相同的提交事件监听器。

如果没有，您可以将两个ajax-submits排队，一个到电子邮件页面，再一次到客户端。

最后，您可以取消绑定事件侦听器。取消绑定事件侦听器的一种鲜为人知的方法是将事件对象传递给unbind - 调用。这将仅取消绑定当前事件侦听器：

$('#form1').submit(function(e){
    if(myvalidator.isValid()){
$form = $('#form1');
$.ajax({
    data: $form.serialize(),
               type: "POST",
               url: "email_send.asp",
               success: function(){
                 $form.unbind(e).submit();
               }
             });
    }
    return false;
});

Answer 7

以下是向不同网址提交表单两次而不重定向的示例代码。点击＆＃34;测试＆＃34;按钮两次。

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="ISO-8859-1">
    <title>Insert title here</title>
    <script type="text/javascript" src="jQuery.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        $("#testBtn").click(function() {
            $("#form").submit();
            $("#form").submit(function() {
                $("#form").attr("action", "download");
            });
        });
    });
    </script>
    </head>
    <body>
        <form id="form" enctype="multipart/form-data" method="post"
            action="upload" target="myIFrame">
            <input type="hidden" name="FileName" />
            <input type="file" name="FileDialog" size="100" />
            <input type="submit" /> <input name="txt" type="text" />
        </form>
        <input id="testBtn" type="button" value="Test" />

        <iframe style="display: none;" src="javascript:''" id="myIFrame">
            <html>
                <head></head>
                <body></body>
            </html>
        </iframe>
    </body>
    </html>

Answer 8

我遇到了同样的问题。然后我注意到我不小心将我的自定义javascript文件链接了两次，因此表单被两个脚本两次提交。通过删除页面页脚的一个脚本链接来解决问题。

BostonHousingPrice

jquery：提交表单两次

8 个答案: