Question

我之前遇到过一个似乎已经解决的问题，但经过仔细检查，它并没有完全修复。我有一个按钮，当点击激活一个javascript发送表单数据，然后清除表单，然后关闭隐藏div。除了我检查数据库似乎提交两次之外，它工作得很好吗？我看了，看不出问题出在哪里了？

按钮是：

<button name ='send' value="Send" type='submit' class='btn btn-primary'>Finish</button>

和重复输入的新JS代码是：

    $(function() {
    $('form').on('submit', function(e) { 
      e.preventDefault();
      $('.output_message').text('Processing...'); 

      var form = $(this);
      $.ajax({
        url: form.attr('action'),
        method: form.attr('method'),
        data: form.serialize(),
        success: function(result) {
          if (result == 'success') {
            $('.output_message').text('Message Sent!');
            form[0].reset();
            $('#5box').hide();
          } else {
            $('.output_message').text('Error Sending email!');
          }
        }
      });
    });
  });

和旧的js（没有清除表格和隐藏div但不重复条目）是：

 $(document).ready(function() {
   $('#btn-finish').on('click', function() {

        // Add text 'loading...' right after clicking on the submit button. 
        $('.output_message').text('Processing...'); 

        var form = $(this);
        $.ajax({
            url: form.attr('action'),
            method: form.attr('method'),
            data: form.serialize(),
            success: function(result){
                if (result == 'success'){
                    $('.output_message').text('Message Sent!');

                } else {
                    $('.output_message').text('Error Sending email!');
                }
            }
        });

        // Prevents default submission of the form after clicking on the submit button. 
        return false;   
    });
});

Answer 1

尝试将return false添加到事件处理程序的末尾。 How to prevent form from being submitted?

Answer 2

删除按钮“type = submit”和

然后使用下面的旧代码。


$(document).ready(function() {
   $('#btn-finish').on('click', function() {

        // Add text 'loading...' right after clicking on the submit button. 
        $('.output_message').text('Processing...'); 

        var form = $(this);
        $.ajax({
            url: form.attr('action'),
            method: form.attr('method'),
            data: form.serialize(),
            success: function(result){
                if (result == 'success'){
                    $('.output_message').text('Message Sent!');

                } else {
                    $('.output_message').text('Error Sending email!');
                }
            }
        });

        // Prevents default submission of the form after clicking on the submit button. 
    });
});

单击按钮时重复的表单提交？

2 个答案: