一尘不染

为什么我的jquery ajax表单第一次提交一次,第二次提交两次?

ajax

我有一个简单的AJAX表单,该表单可以在提交时正常运行。但是,如果我随后将新数据输入相同的表单(而不刷新页面),则它将提交两次表单。如果我第三次这样做,那么它将第三次提交表单,依此类推。为什么这样做呢?这是我的代码:

$(document).ready(function(){
    $("#myForm").submit(function() {
        var myField = $('#myID).val();
        $.ajax({
            type: "POST",
            url: 'myFile.php',
            dataType: 'html',
            data: {myData:myField},
            success: function(data){
                alert(data);
            }
        });

        return false;
    });
});

阅读 242

收藏
2020-07-26

共1个答案

一尘不染

即使我在开发AJAX登录表单时也遇到了同样的问题。搜寻了几个小时后,我找到了解决方案。希望这对您有所帮助。

基本上,您必须在ajax请求完成后 取消绑定 表单的当前实例的Submit操作。因此,在 返回false 之前添加此行

$("#myform").unbind('submit');

因此,您的整个代码应如下所示

    $(document).ready(function(){
        $("#myForm").submit(function() {
            var myField = $('#myID).val();
            $.ajax({
                type: "POST",
                url: 'myFile.php',
                dataType: 'html',
                data: {myData:myField},
                success: function(data){
                    alert(data);
                }
            });

            /* Add this line */
            $("#myform").unbind('submit');
            return false;
        });
    });
2020-07-26