1

我有以下函数检索 .php 文件的内容并将其显示在 div 中。检索部分效果很好，但我想展示一个微调器，例如 1 秒。

这是我的 JQuery 函数：

function f(par){
$("#load").show();
$.ajax({url: par + ".php",
success: function(result){
    $("#info").html(result);
    $("#info").css("top", Math.max(0, (($(window).height() - $("#info").outerHeight()) / 2) + $(window).scrollTop()) + "px");
    $("#info").css("left", Math.max(0, (($(window).width() - $("#info").outerWidth()) / 2) +   $(window).scrollLeft()) + "px");
    $("#info").delay(1000).show(0);
    }});
$("#load").hide();
};

此处加载的是带有微调器的 div，并且信息显示良好.. 检索到的信息！主要计划是延迟（因为检索根本不需要时间）show(0) 函数，让微调器运行至少 1 秒。

css 如下（来自How can I create a "Please Wait, Loading..." 动画 using jQuery?）：

#load {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 255, 255, 255, .8 ) 
                url('http://sampsonresume.com/labs/pIkfp.gif')
                50% 50% 
                no-repeat;
}

#info{
display: none;
position: fixed;
z-index: 500;
height: 40%;
width: 60%;
overflow: auto;
background: rgba(0, 190, 0, .8);
}

我也尝试过使用 $(this).addClass("load"); 但这也没有用。

出了什么问题？

解决方案：

（对于那些感兴趣的人）感谢 j08691，解决方案非常简单：

setTimeout(function() {
        $("#info").show();
        $("#load").hide();
    }, 1500);
4

1 回答 1

1

您需要将该$("#load").hide();语句移动到 ajax 请求的回调中，因为它现在的方式将在之后立即触发它$("#load").show();。此外，.delay()用于效果而不是回调。改为使用setTimeout()呼叫。

于 2012-07-18T15:06:54.587 回答