使用Ajax提交到2个不同的PHP表单

当我想使用2个不同的PHP页面发送2个具有不同值的表单时，我遇到了问题。

我的ajax代码是这样的：

$(document).ready(function() { var form = $('#main_form_new'); var submit = $('.sbbtn'); var alert = $('.form_result'); form.on('submit', function(e) { e.preventDefault(); $.ajax({ url: 'ajax/category.php', type: 'POST', dataType: 'html', data: form.serialize(), beforeSend: function() { alert.fadeOut(); submit.html('Saving Changes....'); }, success: function(data) { alert.html(data).fadeIn(); form.trigger('reset'); // reset form submit.html('Save Changes'); }, error: function(e) { console.log(e) } }); }); }); 

对于第二种forms，我更改了var并将其替换为

  var itemform = $('#item_main_itemform_new'); var itemsubmit = $('.itemsbbtn'); var itemalert = $('.item_itemform_result'); itemform.on('submit', function(e) { e.preventDefault(); $.ajax({ url: 'ajax/items.php', type: 'POST', dataType: 'html', data: itemform.serialize(), beforeSend: function() { itemalert.fadeOut(); itemsubmit.html('Saving Changes....'); }, success: function(data) { itemalert.html(data).fadeIn(); itemform.trigger('reset'); // reset itemform itemsubmit.html('Save Changes'); }, error: function(e) { console.log(e) } }); }); 

这不起作用，因为我真的不知道原因。 我哪里做错了？

Answer 1

不要重复自己。

如果您需要两次相同的function，请不要复制和粘贴代码。 创建一个函数，使用变量部分的变量，调用该函数两次。

 $(function() { function formSubmitHandler(options) { return function (e) { var $form = $(this), $submit = $(options.submit), $alert = $(options.alert); e.preventDefault(); $alert.fadeOut(); $submit.html('Saving Changes...').prop({disabled: true}); $.post(options.url, $form.serialize()) .done(function (data) { $alert.html(data).fadeIn(); $form.trigger('reset'); }) .fail(function (jqXHR, textStatus, errorThrown) { $alert.html(textStatus).fadeIn(); console.log(arguments); }) .always(function () { $submit.html('Save Changes').prop({disabled: false}); }); }; } $('#main_form_new').submit(formSubmitHandler({ url: 'ajax/category.php', submit: '.sbbtn', alert: '.form_result' })); $('#item_main_itemform_new').submit(formSubmitHandler({ url: 'ajax/items.php', submit: '.itemsbbtn', alert: '.item_itemform_result' })); });