我在同一页面上使用AJAX/PHP处理两个表单（在Bootstrap模式中）。我可能会错误地处理这个问题，但我有两个单独的文件来检索POST信息。我更改了所有的变量和id。
第一个表单按预期工作-发送电子邮件，并在表单底部告诉用户"消息已提交"。第二个表单发送电子邮件，但不会向用户提供收到电子邮件的任何反馈，如果没有收到，则会给用户一个错误。
问题似乎是函数submitMSG——对第一种形式有效，对第二种形式不起作用。
我将在这里发布我的2.js文件——希望有人知道我做错了什么。谢谢
业务表单脚本
$("#businessForm").validator().on("submit", function (event) {
if (event.isDefaultPrevented()) {
// handle the invalid form...
formError();
submitMSG(false, "Did you fill in the form properly?");
} else {
// everything looks good!
event.preventDefault();
submitFormBusiness();
}
});
function submitFormBusiness(){
// Initiate Variables With Form Content
var yourNameBusiness = $("#yourNameBusiness").val();
var yourEmailBusiness = $("#yourEmailBusiness").val();
var yourPhoneBusiness = $("#yourPhoneBusiness").val();
var yourStreetBusiness = $("#yourStreetBusiness").val();
var yourCityBusiness = $("#yourCityBusiness").val();
var yourStateBusiness = $("#yourStateBusiness").val();
var yourZipBusiness = $("#yourZipBusiness").val();
var accountBusiness = $("#accountBusiness").val();
var otherNameBusiness = $("#otherNameBusiness").val();
var otherBusinessBusiness = $("#otherBusinessBusiness").val();
var otherEmailBusiness = $("#otherEmailBusiness").val();
var otherPhoneBusiness = $("#otherPhoneBusiness").val();
var otherStreetBusiness = $("#otherStreetBusiness").val();
var otherCityBusiness = $("#otherCityBusiness").val();
var otherStateBusiness = $("#otherStateBusiness").val();
var otherZipBusiness = $("#otherZipBusiness").val();
var humanBusiness = $("#humanBusiness").val();
$.ajax({
type: "POST",
url: "form-process-refer-a-business.php",
data: "&yourNameBusiness=" + yourNameBusiness + "&yourEmailBusiness=" + yourEmailBusiness + "&yourPhoneBusiness=" + yourPhoneBusiness + "&yourStreetBusiness=" + yourStreetBusiness + "&yourCityBusiness=" + yourCityBusiness + "&yourStateBusiness=" + yourStateBusiness + "&yourZipBusiness=" + yourZipBusiness + "&accountBusiness=" + accountBusiness + "&otherNameBusiness=" + otherNameBusiness + "&otherBusinessBusiness=" + otherBusinessBusiness + "&otherEmailBusiness=" + otherEmailBusiness + "&otherPhoneBusiness=" + otherPhoneBusiness + "&otherStreetBusiness=" + otherStreetBusiness + "&otherCityBusiness=" + otherCityBusiness + "&otherStateBusiness=" + otherStateBusiness + "&otherZipBusiness=" + otherZipBusiness + "&humanBusiness=" + humanBusiness,
success : function(text){
if (text == "success"){
formSuccess();
} else {
formError();
submitMSG(false,text);
}
}
});
}
function formSuccess(){
$("#businessForm")[0].reset();
submitMSG(true, "Message Submitted!");
}
function formError(){
$("#businessForm").removeClass().addClass('shake animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
$(this).removeClass();
});
}
function submitMSG(valid, msg){
if(valid){
var msgClasses = "h3 text-center tada animated text-success";
} else {
var msgClasses = "h3 text-center text-danger";
}
$("#businessSubmitMsg").removeClass().addClass(msgClasses).text(msg);
}
好友表单脚本
$("#friendForm").validator().on("submit", function (event) {
if (event.isDefaultPrevented()) {
// handle the invalid form...
formError();
submitMSG(false, "Did you fill in the form properly?");
} else {
// everything looks good!
event.preventDefault();
submitFormFriend();
}
});
function submitFormFriend(){
// Initiate Variables With Form Content
var yourNameFriend = $("#yourNameFriend").val();
var yourBusinessFriend = $("#yourBusinessFriend").val();
var yourEmailFriend = $("#yourEmailFriend").val();
var yourPhoneFriend = $("#yourPhoneFriend").val();
var yourStreetFriend = $("#yourStreetFriend").val();
var yourCityFriend = $("#yourCityFriend").val();
var yourStateFriend = $("#yourStateFriend").val();
var yourZipFriend = $("#yourZipFriend").val();
var accountFriend = $("#accountFriend").val();
var otherNameFriend = $("#otherNameFriend").val();
var otherBusinessFriend = $("#otherBusinessFriend").val();
var otherEmailFriend = $("#otherEmailFriend").val();
var otherPhoneFriend = $("#otherPhoneFriend").val();
var otherStreetFriend = $("#otherStreetFriend").val();
var otherCityFriend = $("#otherCityFriend").val();
var otherStateFriend = $("#otherStateFriend").val();
var otherZipFriend = $("#otherZipFriend").val();
var humanFriend = $("#humanFriend").val();
$.ajax({
type: "POST",
url: "form-process-refer-a-friend.php",
data: "&yourNameFriend=" + yourNameFriend + "&yourBusinessFriend=" + yourBusinessFriend + "&yourEmailFriend=" + yourEmailFriend + "&yourPhoneFriend=" + yourPhoneFriend + "&yourStreetFriend=" + yourStreetFriend + "&yourCityFriend=" + yourCityFriend + "&yourStateFriend=" + yourStateFriend + "&yourZipFriend=" + yourZipFriend + "&accountFriend=" + accountFriend + "&otherNameFriend=" + otherNameFriend + "&otherBusinessFriend=" + otherBusinessFriend + "&otherEmailFriend=" + otherEmailFriend + "&otherPhoneFriend=" + otherPhoneFriend + "&otherStreetFriend=" + otherStreetFriend + "&otherCityFriend=" + otherCityFriend + "&otherStateFriend=" + otherStateFriend + "&otherZipFriend=" + otherZipFriend + "&humanFriend=" + humanFriend,
success : function(text){
if (text == "success"){
formSuccess();
} else {
formError();
submitMSG(false,text);
}
}
});
}
function formSuccess(){
$("#friendForm")[0].reset();
submitMSG(true, "Message Submitted!");
}
function formError(){
$("#friendForm").removeClass().addClass('shake animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
$(this).removeClass();
});
}
function submitMSG(valid, msg){
if(valid){
var msgClasses = "h3 text-center tada animated text-success";
} else {
var msgClasses = "h3 text-center text-danger";
}
$("#friendSubmitMsg").removeClass().addClass(msgClasses).text(msg);
}
问题是函数submitMSG已经定义好了（正如u_mulder所提到的），当提交好友表单时，会使用第一个submit MSG函数。因此，消息应该出现在#businessForm表单的底部。正如您所提到的，更改submitMSG函数的名称，使每个表单都有不同的函数名称应该可以工作。
解决这个问题的另一种方法是通过函数传递表单元素，以便每个函数对传递给它的元素执行其操作，例如：
$('.msg-form').validator().on('submit', function (event) {
var self = $(this);
if (event.isDefaultPrevented()) {
// handle the invalid form...
formError(self, "Did you fill in the form properly?");
} else {
// everything looks good!
event.preventDefault();
submitMessageForm(self);
}
});
function submitMessageForm (form) {
var data = new FormData();
form.find('.input-field').each(function () {
data.append($(this).attr('name'), $(this).val());
//or you could define a var 'params' outside the
//loop and add the params like
//var params += $(this).attr('name') + '=' + $(this).val() + '&';
//Just remember to remove the last & afterwards
});
var url = form.attr('action');
$.ajax({
type: "POST",
url: url,
data: data,
success : function(text){
if (text == "success"){
formSuccess(form, "Message Submitted!");
} else {
formError(form, text);
}
}
});
}
function formSuccess(form, message){
form[0].reset();
submitMSG(form, true, message);
}
function formError(form, message){
form.removeClass().addClass('shake animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
$(this).removeClass();
});
submitMSG(form, false, message);
}
function submitMSG(form, valid, msg){
if(valid){
var msgClasses = "h3 text-center tada animated text-success";
} else {
var msgClasses = "h3 text-center text-danger";
}
form.removeClass().addClass(msgClasses).text(msg);
}`enter code here`