jQuery對話框 - 在打開之前顯示加載圖像和加載內容

我正在使用jquery模式對話框來顯示我的部分視圖中的數據表。在部分視圖中，我使用了用於將我的HTML表格更改爲jQuery DataTable的腳本。所以我需要確保表格在對話框中顯示之前格式良好。所以，我用.load的回調函數（）打開對話框（問題：這是一個正確的/有道）：jQuery對話框 - 在打開之前顯示加載圖像和加載內容

$detaildialog.load(url, function() { 
      $detaildialog.dialog('open'); 
     });

然而，裝貨，用戶將看不到延遲直到對話框準備就緒並打開。這不是用戶友好的，所以我希望在加載對話框時顯示加載圖像。我曾試圖在對話框的初始化過程中的圖像添加，但它不工作：

var $detaildialog; 
    var loadingPic = $('<img src="../../Content/Images/loading.png"'); 
    $detaildialog = $('<div></div>').append(loadingPic.clone()).dialog({ 
     autoOpen: false, 
     title: 'Food Details', 
     modal: true 
    });

任何想法，我怎麼能保證我的對話框顯示正確的表，同時保持用戶的加載圖像通知之前的對話框準備就緒??

謝謝..

來源

2011-07-26 shennyL

我想我弄明白，只是分享在這裏做它自己的路：

HTML：

<div id="loading"> 
    Please Wait ...<br /> 
    <img src="../../Content/Add_in_Images/loading.gif" alt="Processing" /> 
    </div>

的jQuery：

$('#loading').hide(); 
// Once clicked, show loading image first 
$('#loading').show(); 
$detaildialog.load(url, function() { 
      $('#loading').hide(); 
      $detaildialog.dialog('open'); 
     });

來源

2011-10-11 00:00:11 shennyL

HTML：

<div id="agentListDia"> 
    <span id="loading"> Loading .... </span> 
</div>

Jquery：

$("#agentListDia").dialog({ 
    autoOpen: false, 
    height: "auto", 
    width: "auto", 
    modal: true, 
    draggable: false 
}); 

$("#agentListDia").load(URL,function(){ 
    $("#loading").hide(); 
    $("#agentListDia").dialog("open"); 
}); 
// where URL is the page to be loaded into div

來源

2014-07-14 09:18:43 Taksh

jQuery對話框 - 在打開之前顯示加載圖像和加載內容

回答

相關問題