Question

我在一个页面上有三个表单 - “回调”，“联系我们”和“简报订阅”。

每个人都有自己的jQuery函数来“发布”数据（使用.post），然后显示任何返回的PHP。这些表单只输出简单的错误和成功，具体取决于表单和过程。

现在，这里有点奇怪......我的三个表单都可以工作但只有两个工作正常：

响应DIV隐藏
响应DIV填充返回的HTML
响应DIV很好地淡出。

然而，我的主要“联系我们”表格是奇怪的......响应DIV立即出现，没有淡入淡出效果。

我已经读过我应该首先“隐藏（）”DIV - 我试过没有任何成功，似乎没有任何工作。

我注意到如果我返回纯文本（由PHP回应），则淡入淡出效果....但是当我尝试输出任何HTML标记时，它都会失败并且DIV会立即显示... < / p>

我的表格回复：

<div><span id="contactUsAjaxResponse"></span><div>

我的jQuery函数

$(document).ready(function(){
$("#contactUsForm").submit(function(){
var responseDiv = '#contactUsAjaxResponse';
// add ajax-loader class to response div
$(responseDiv).html('').addClass('ajax-loader');
// get form actiom
var formAction = $(this).attr('action');
$.post(formAction, $("#contactUsForm").serializeArray(), function(data){
$(responseDiv).removeClass('ajax-loader').html(data).fadeIn('slow');
});
return false; //prevent default form action
});
});

任何回显的HTML都是<php echo '<div class="error">Content...</div>'; ?>等。

我觉得它可能是我的CSS（任何display: block;或其他条目都可能导致问题吗？）

非常感谢

Answer 1

最好的方式（imo）是让你的网页上已经存在result-div（你称之为错误）。使用display: none使用css隐藏它并将其设为空。当结果被检索时，在该元素上使用fadeIn（'slow'）。

基线是使用js隐藏div没有意义，然后再显示它。这可以简单地使用css

完成

在jQuery帖子之后淡出

1 个答案: