如何使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？

回答

相關問題