表示等待圖像

我有以下HTML代碼表示等待圖像

<li><div><..><input type="submit" ...></div></li>

我增加點擊事件的按鈕來刪除整個<li>。該過程需要一段時間1/2秒。我想包括與等待圖標的消息在處理移除我的代碼下面的代碼：

var $li = $(btnRemove).closest('li').empty(); 

    // Add Please wait 
    var $logo = $('<img>').attr('src', 'logo.gif'); 
    var $tblWait = $('<table />').append(
      $('<tr />').stop() 
      .append($('<td/>').append($logo)) 
      .append($('<td/>').html(' Pleasee wait while removing table')) 
      ); 
    $li.append($('<div/>').append($tblWait)); 

..... Process and do other tack and finally 
$li.remove();

，如果我把一個斷點，我會看到標誌&和消息，但沒有斷點的李將1日後被刪除/ 2秒，但消息不會顯示徽標。我試圖在頁面就緒事件中加載圖像，但該標誌非常小，不需要任何時間加載。任何幫助將不勝感激。

來源

2012-01-13 Frenchi In LA

裏，不會刪除空（）刪除包含李，但標籤在那裏。正如我所說，我可以看到這個標誌，如果我在LI追加表格後加上一個斷點 – 2012-01-13 18:17:50

這是由於JavaScript和DOM共享相同線程的本質。一旦對DOM進行了任何更改，UI將不會重新繪製，直到線程完成。該過程可能會是這個樣子：

(idle) -> Event fires -> JavaScript code executes -> Repaint GUI -> (idle)

爲了要顯示的消息，則需要使用定時器延遲漫長的過程：

$li.append($('<div/>').append($tblWait)); 

window.setTimeout(function() { 
    //... Process and do other tack and finally 
    $li.remove(); 
}, 0);

來源

2012-01-13 18:19:02

謝謝。它完成了這項工作。 – 2012-01-13 18:26:59

表示等待圖像

回答

相關問題