jQuery自動完成只在對話框中工作一次

Question

我有這個測試代碼，除了自動完成功能在第二次打開對話框時停止工作以外，完美地工作。我需要使用html以這種方式打開對話框，因爲我希望它能夠快速打開，這是最好的方式。爲什麼自動完成功能第二次停止工作？

var $container = $('#container'), 
    $input = $container.find('input:eq(0)'); 

var source = new Array(2); 

source[0] = { value: 1000, label: 'Description' }; 
source[1] = { value: 1001, label: 'Description' }; 

$input.autocomplete({ source: source }); 

var $dialog = $('<div></div>').dialog({ 
    autoOpen: false, 
    modal: true, 
    beforeclose: function() { $dialog.html(''); } 
}); 

$('#open').click(function() { 
    $dialog.dialog('open').html($container); 
}); 

編輯：我這樣使用html的原因是因爲我想打開一個空的對話框來加速它。這樣做會使對話看起來更有反應。我想繼續以這種方式打開對話框。這個祕密依然存在，爲什麼事件處理程序和自動完成功能第二次停止工作，我以這種方式打開對話框？ $ container或$ input中沒有任何更改。

Answer 1

如果您的$容器內容是靜態的，爲什麼不添加它只是一次。我相信你的問題是每次打開對話框時添加$ container元素的事實。

嘗試

var $container = $('#container'), 
    $input = $container.find('input:eq(0)'); 

var source = new Array(2); 

source[0] = { value: 1000, label: 'Description' }; 
source[1] = { value: 1001, label: 'Description' }; 

$input.autocomplete({ source: source }); 

var $dialog = $('<div></div>').dialog({ 
    autoOpen: false, 
    modal: true 
}).html($container); 

$('#open').click(function() { 
    $dialog.dialog('open'); 
}); 

Answer 2

即與jQuery UI狀態管理相關的，因爲這種狀態管理的，你不能實例相同的插件上的元素多次，除非你先摧毀插件實例。

此處瞭解詳情：http://blog.nemikor.com/2009/04/08/basic-usage-of-the-jquery-ui-dialog/

反正你可以調用初始化對話框HTML（），它會工作：

var $dialog = $('<div></div>').dialog({ 
    autoOpen: false, 
    modal: true 
}).html($container); 

$('#open').click(function() { 
    $dialog.dialog('open'); 
}); 

Answer 3

這奏效了我。基本上清除對話框，並關閉它。

     $dailyregisterdialog.dialog({ 
          resizable: false, 
          width: 800, 
          modal: true, 
          title: "Daily Class Register", 
          position: [150,90], 
          close: function(){ 
           $(this).html("").destroy(); 
          } 
         });