jQuery UI對話框模式選項不工作setTimeout

Question

我有需要呈現頁面上發生事件時的jQuery UI對話框。

該對話框具有以下設置。

var opt = { 
    autoOpen: false, 
    modal: true, 
    width: 1000, 
    height: 650, 
    title: 'Title Here' 
}; 

當按下按鈕時，運行以下代碼。 （連同其他500行）

$("#dlgInfo").dialog(opt).dialog("open"); 

到目前爲止在Chrome和Firefox中都很出色。除IE之外根本不呈現對話框。 研究表明，IE正在有點急於渲染盒子並失敗。 解決方案是將打開的代碼包裝在setTimeout函數中。

setTimeout(function() { 
    $("#dlgInfo").dialog(opt).dialog("open"); 
}, 500); 

成功，對話框現在在所有瀏覽器中打開，但由於某種原因，我在Chrome中丟失了Model屬性。我不知道爲什麼..

編輯...

我開始覺得一個JSON調用是搞亂這件事。它看起來像Modal選項正在設置，但是當一個JSON對象呈現給頁面時，它會導致模式方面消失。

以下是JSON代碼的示例。

$('#clientResults').empty(); 
$.ajax({ 
    type: "GET", 
    url: "http://" + window.location.hostname + window.location.pathname + "handlers/clients.ashx?" + $("#searchfield").val(), 
    async: true, 
    dataType: "json", 
    success: function (data) { 
    $('#clientResults').append('<a id="Clients"><h1>Clients (' + data.Clients.length + ') - Click client name to view client matters.</h1></a>'); 
    if (data.Clients.length > 0) { 
     $('#clientResults').append('<table id="clientTable" class="Results clients"><thead><tr><th>Group Entity</th><th>Client Name</th><th>Client Code</th><th>Status</th><th>Type</th><th>Office</th><th>Active</th><th>Responsible Billing Partner</th><th>Open Date</th><th>Close Date</th></tr></thead><tbody></tbody></table>'); 
     for (var i = data.Clients.length; i--;) { 
      $('#clientTable > tbody:last').append('<tr id = "' + data.Clients[i].Group + $.trim(data.Clients[i].ClientCode) + '" onclick="addDetails(this.rowIndex);"><td>' + data.Clients[i].Group + '</td><td>' + data.Clients[i].ClientName + '</td><td>' + data.Clients[i].ClientCode + '</td><td>' + data.Clients[i].Status + '</td><td>' + data.Clients[i].entity_type + '</td><td>' + data.Clients[i].Office + '</td><td>' + data.Clients[i].Active + '</td><td>' + data.Clients[i].RespBillEmpl + '</td><td>' + data.Clients[i].OpenDate + '</td><td>' + data.Clients[i].CloseDate + '</td></tr>'); 
       } 
       $("#clientTable").tablesorter(); 
      } 
     }, 
     failure: function() { 
      $('#clientResults').empty(); 
      $('#clientResults').append('<a id="Clients"><h1>Clients</h1></a>'); 
      $('#clientResults').append('An error has occoured getting the client data. Please contact Service Desk on ext 5555. Thanks'); 
     } 
    }); 

#ClientResults是一個空的div標記。

Answer 1

這可能是一個鏈接問題。你可以嘗試把它分成兩個這樣的陳述嗎？

$("#dlgInfo").dialog(opt); 
$("#dlgInfo").dialog("open"); 

如果這沒有奏效，那麼也許這？

$("#dlgInfo").dialog(opt); 

setTimeout(function(){ 

    $("#dlgInfo").dialog("open"); 

}, 1); 

它也可能是一個範圍問題。如果記錄opt對象，你會得到預期的結果嗎？

console.log(opt); 
$("#dlgInfo").dialog(opt); 
$("#dlgInfo").dialog("open");