Question

以下代码用于允许用户发送查询。联系表单在初始加载网站时加载，如果用户随后立即访问联系表单并处理查询，则代码按预期工作。如果用户首次单击另一个使用AJAX动态加载内容并随后访问联系人页面并发送查询的选项卡，则会出现此问题。

虽然发送了消息，但是来自服务器的返回成功消息正在屏幕上回显，并且所有内容都已丢失。有人知道原因是什么吗？

Jquery和AJAX代码

$(document).ready(function() {
var request;
$("#EnquiryForm").submit(function(event){
if (request) {
request.abort();
}
event.preventDefault();
var $form = $(this);
var $inputs = $form.find("input, select, button, textarea");
var serializedData = $form.serialize();
$inputs.prop("disabled", true);
request = $.ajax({

url: "index.php",
type: "POST",
data: serializedData
});
request.done(function (response, textStatus, jqXHR){
    alert(response);                
});
request.fail(function (jqXHR, textStatus, errorThrown){
    console.error("The following error occurred: " + textStatus, errorThrown);
});
request.always(function () {
$("#EnquiryForm")[0].reset();
     $('#seniorEnquiries').prop('checked', true);
    $('input').iCheck({
    radioClass: 'iradio_square-red',
    increaseArea: '20%' // optional
  });   

$inputs.prop("disabled", false);});
$('input').iCheck('enable');
})
})

PHP

$message = sendEnquiry();
echo $message;

Answer 1

您的代码在document ready上运行并设置事件挂钩submit，因为选项卡HTML是通过Ajax加载的，它没有附加事件挂钩，并且document ready未被触发再次，表单作为正常的post / get而不是通过Ajax提交。

每次在选项卡中加载表单html时，通过设置submit挂钩来修复它。

AJAX Post在后续加载另一个动态页面后没有捕获响应

1 个答案: