如何在表单的动作中使用jQuery .ajax

我改变了我的php和jQuery的编码风格，但是我的注册

$("#reg_form_company").bind("submit", function() { $.fancybox.showActivity(); $.ajax({ type : "POST", cache : false, url : $(this).attr('action'), data : $(this).serializeArray(), success : function(data) { $(".printArea").empty().append(data).css('visibility','visible'); } }); return false; }); 

那是我的表格

 
 [...]  

然后单击“提交”按钮后，它不起作用，我认为有人可以帮我解决这个问题，因为$ .ajax可能会混淆POST（输入）和GET（参数“行动“forms）

感谢您的帮助，如果需要，您还可以修改整个jQuery代码。

很抱歉，不包括#reg_form_company和fancybox

Answer 1

你需要做这样的事情： http ： //jsfiddle.net/xSJTs/2/

 $('form').on('submit',function(e){ e.preventDefault(); $.ajax({ type : "POST", cache : false, url : $(this).attr('action'), data : $(this).serialize(), success : function(data) { $(".printArea").empty().append(data).css('visibility','visible'); } }); }); 

您必须使用serialize()而不是serializeArray() 。 serializeArray()创建一个JavaScript对象， serialize()创建一个查询字符串。

序列化： http ： //api.jquery.com/serialize/

SerializeArray： http ： //api.jquery.com/serializeArray/

基本上你等到表单提交然后你打断它（ e.preventDefault(); ）。

Answer 2

您必须截取表单的click / submit事件，并参考下面显示的表单：

  $("#myForm").submit(function(){ var $form = $(this); $.ajax({ type : "POST", cache : false, url : $form.attr('action'), data : $form.serializeArray(), success : function(data) { $(".printArea").empty().append(data).css('visibility','visible'); } }); }) 

并为您的表单添加一个ID，如：

 
 [...]  

Answer 3

你必须参考你的表格而不是$(this)

给你的表格一个id或类ex：

 
 [...]  

在JQuery中：

 $.ajax({ type : "POST", cache : false, url : $('#MyForm').attr('action'), data : $('#MyForm').serializeArray(), success : function(data) { $(".printArea").empty().append(data).css('visibility','visible'); } }); 

Answer 4

  //This is still showing the cgi output of my script in the browser $('#myForm').submit(function()){ $('#myForm').preventDefault(); $.ajax({ type : "POST", cache : false, url : $('#myForm').attr('action'), data : $('#myForm').serialize(), success : function(data) { $(".printArea").empty().append(data).css('visibility','visible'); }; 
 

Answer 5

适用于文件输入的Ajax

嗨，
其他答案对我来说没有用 ，因为我需要传递文件输入而且thoses不能“序列化”。

好方法是通过FormData传递它并禁用processData ：

 $('form').on('submit',function(e){ e.preventDefault(); var formData = new FormData(this); $.ajax({ type : "POST", cache : false, url : $(this).attr('action'), data : formData, success : function(data) { //$(".printArea").empty().append(data).css('visibility','visible'); }, contentType: false, processData: false }); }); 

希望它有所帮助;）