如何使div可见使用jQuery？

function showwaitmsg() { 
     $("#wait").fadeIn(); 
     return true; 
    } 
    function hidewaitmsg() { 
     $("#wait").fadeOut(); 

    } 

    $("a:contains('Test1')").bind("click", function() { 
     if (showwaitmsg()) 
     test2(); // Function contains XMLHttpRequest 
     hidewaitmsg(); 
    }); 


    <div id="wait" class="overlay" style="display: none"> 
      Please Wait 
     <img src="~/loading.gif" /> 
    </div>

我正在处理XMLHttpRequest时，试图使用上面的代码显示“请稍候”消息。请求处理完毕后，等待div显示太迟。你能告诉我应该怎么做，让点击test1按钮后立即显示等待div？如何使div可见使用jQuery？

来源

2014-02-12 Grasshopper

删除'hidewaitmsg（）'调用并将其放入ajax请求的成功调用中。 Ajax是异步的，所以你的隐藏消息被立即处理 –

发布'test2（）'的代码 - 最好的方法可能是使用'XmlHttpRequest'中的回调函数来执行'fadeOut（）'调用 –

使用jQuery Ajax .always函数，所以消息在所有情况下都被隐藏。 –

除了在test2()之外调用showwaitmsg()和hidewaitmsg()，您应该将它们包含在您的ajax调用中。

$.ajax({ 
    ..., 
    beforeSend: showwaitmsg(), 
    ..., 
    complete: hidewaitmsg() 
});

在beforeSend函数中返回false将取消请求。从jQuery 1.5开始，无论请求类型如何，beforeSend选项都会被调用。还值得注意的是，在success和error回调被执行后调用complete。

来源

2014-02-12 21:56:09

$("#id_of_button").on('click', function() { 
    $("#wait").show(); 
});

来源

2014-02-12 21:12:07 Adosi

最好就是这个代码移到AJAX调用自身，就像这样：

$.ajax({ 
    ..., 
    beforeSend: function() { 
     $('#wait').fadeIn(); 
    }, 
    complete: function() { 
     $('#wait').fadeOut(); 
    } 
});

这将有助于逻辑正确分离和支持更多的办法，使在这样的AJAX调用您的代码，例如按键盘按钮等。

来源

2014-02-12 21:18:57

如何使div可见使用jQuery？

回答

相关问题