javascript - 为什么Ajax表单提交两次？

Question

为什么下面的脚本会导致表单提交两次？即使在尝试了互联网上发布的其他解决方案之后，我也无法弄清楚这一点。提交两次会导致数据库中出现重复条目​​。预先感谢您对此进行调查!

<script type="text/javascript">
$(document).ready(function(){   
    $('#form-error').hide();
    $("#form-submit").click(function(){
        $("#form").submit();
    });
});

$('#form').submit(function(e) {
            register();
    e.preventDefault();
    });

function register()
{               
    jQuery.ajax({
        method: 'POST',
        url: 'actions/add.php',
        data: $('#form').serialize(),
        dataType:'json',
        success: function(msg){

            if(parseInt(msg.status)==1)
            {
                window.location=msg.txt;
            }
            else if(parseInt(msg.status)==0)
            {
                error(1,msg.txt);
            }
        }
    });

}               

function hideshow(el,act)
    {
    if(act) 
        {
        $('#'+el).hide(0).slideDown(500, 'linear');
        }
    else $('#'+el).hide();
    }   

function error(act,txt)
    {
    if(txt) 
        {
        $('#form-error').html(txt);
        }
    $('#form-error').hide(0).slideDown(500, 'linear');
    }
</script>

HTML 表单:

 <form id="form">
            <p>First Name:</p>
            <input type="text" name="firstname" />
            <p>Last Name:</p>
            <input type="text" name="lastname" />
            <p>E-Mail Address:</p>
            <input type="text" name="emailaddress" />
            <p>Sequence Assignment:</p>
            <select name="sequence">
                <option value="1">Default Sequence</option>
            </select>
            <button id="form-submit">Add User</button>
            <p id="form-error"></p>
</form>

Answer 1

提交事件有重复的事件监听器:

1.单击提交按钮时:

$("#form-submit").click(function(){
   $("#form").submit();
});

2.提交表单时:

$('#form').submit(function(e) {
            register();
    e.preventDefault();
});

您只需要其中之一。

更改您的代码，例如:

<script type="text/javascript">
$(document).ready(function(){   
    $('#form-error').hide();
    $('#form').submit(function(e) {
        register();
        e.preventDefault();
    });
});

function register()
{
    .
    .
    .