Javascript AJAX表单发布，即使在禁用后也是如此

我有两个表单，它们使用AJAX将数据发布到另一个页面，第一个表单可以精细地发布数据，但第二个表单可以刷新页面

我曾尝试将第二个表单的JavaScript放在另一个文件中，或使用标记放在标题中，但这也没有帮助

Javascript代码：

$(document).ready(function(){
var form = $('#form1');   
form.submit(function(event){

    var data1= $('#data1').val(); 
    var data2= $('#data2').val(); 

    $.post('includes/page2.inc.php', {data1: data1, data2: data2}, function(data){
        $('#div').html(data);
    });
}
event.preventDefault();
});

    var form2 = $('#form2');
    form2.submit(function(event){
        var data3= $('#data3').val(); 
        var data4= $('#data4').val(); 
        $.post('page2.inc.php', {data3: data3, data4: data4}, function(data){
            $('#div').html(data);
        });
    }
event.preventDefault();
});
});

HTML:

选择1
选择。。。
1.
2.
3.


选择2
选择。。。
3.
4.
5.


下一个
选择1
选择2


下一个

我希望“form2”在提交后不会发布，就像它目前正在做的那样，如果我删除第二个表单的代码，第一个表单提交时不会发布，但是如果我包含它，它会像正常一样发布

我忘了在我的帖子中提到，我不知道这是否重要，但第二张表格在另一个文件中

---

编辑：通过将文档（page2.php）绑定到提交的第二个表单来解决问题

form2无法正常工作，因为它超出了

$（document）.ready

函数的范围

另外，

event.preventDefault（）

应该在每个表单的提交函数中。 总的来说，您的代码应该是这样的

$(document).ready(function(){
    var form = $('#form1');
    form.submit(function(event){
        event.preventDefault();
        var data1= $('#data1').val();
        var data2= $('#data2').val();

        $.post('includes/page2.inc.php', {data1: data1, data2: data2}, function(data){
            $('#div').html(data);
        });

    });

    var form2 = $('#form2');
    form2.submit(function(event){
        event.preventDefault();  
         var data3= $('#data3').val();
        var data4= $('#data4').val();
        $.post('page2.inc.php', {data3: data3, data4: data4}, function(data){
            $('#div').html(data);
        });

    });
});

---

在我看来，上面的内容要么是不正确的，要么是遗漏了什么。你能确认粘贴和创建问题时是否遗漏了什么吗？你能用html标记更新问题吗？@RamRaider javascript代码？因为我可能在编辑帖子的过程中输入了错误，所以第二篇文章缺少了

$（document）.ready（function（）{

？）为什么要发出两个ajax请求？您可以使用

FormData

对象并从两个表单中附加值，或者使用每个表单中的值创建自己的对象使用类似的工具-它会指出您的错误。

$(document).ready(function(){
    var form = $('#form1');
    form.submit(function(event){
        event.preventDefault();
        var data1= $('#data1').val();
        var data2= $('#data2').val();

        $.post('includes/page2.inc.php', {data1: data1, data2: data2}, function(data){
            $('#div').html(data);
        });

    });

    var form2 = $('#form2');
    form2.submit(function(event){
        event.preventDefault();  
         var data3= $('#data3').val();
        var data4= $('#data4').val();
        $.post('page2.inc.php', {data3: data3, data4: data4}, function(data){
            $('#div').html(data);
        });

    });
});