Question

我正在创建一个网站并使用jquery发布表单。当我按下提交按钮时，jquery函数将表单发布到php文件。 php文件会产生结果错误或成功。结果由php文件回应和jquery文件使用.html()方法输出echo。

我调用html输出#result.

所以我的问题是如何使用 jquery 隐藏#result。这必须在5秒后发生。

当#result加载页面时，此工作正常。但不是像上面所说的那样加载#result。

setTimeout(function(){ 
      $('#result').slideUp(500);  
}, 5000);

Answer 1

我认为最简单的方法是在你的html中始终使用空结果div并将其隐藏起来。这样，无论何时从AJAX获得结果，您都可以更改html，显示它，然后再将其向上滑动。

$("#result").html(AJAX RESULT);
$("#result").show();
setTimeout(function(){ 
      $('#result').slideUp(500);  
}, 5000);

这将改变div的html然后显示它。然后在5秒后隐藏它。

Answer 2

您可以将$ .ajax与 success 回调选项一起使用，或使用.done（）方法。例如：

$.ajax({
    url:"http://someurl/",
    success: function(data){ $('#result').html('success').show(); },
    error: function(data){ $('#result').html('error').show(); }
}).done(function(){
   setTimeout(function(){ 
       $('#result').slideUp(500);  
   }, 5000);
})

Answer 3

事情 #result 有时会动态添加到DOM中，并且jQuery函数通常在文档准备好时加载，为了解决这个问题，你必须听DOM更改。如果由于某种原因你没有使用AJAX或需要其他方法，你可以试试这个：

function hideMsg(){
    // Hide dynamically added div
    setTimeout(function(){ 
          $('#result').slideUp(500);  
    }, 5000);
}
// Listen DOM changes
$('.document').bind("DOMSubtreeModified", hideMsg);

为了使其正常工作，您必须通过文档包装器更改 .document （将显示您的消息）。

jsFiddle示例：http://jsfiddle.net/laelitenetwork/GUxgX/

干杯。

jquery隐藏了由jquery加载的div

3 个答案: