0

DOM にオートコンプリート テキストボックスがあります (jquery を使用)。ボタンをクリックすると、ダイアログボックスにこのオートコンプリートテキストボックスを表示する必要があるシナリオがあります。ダイアログビューでのみオートコンプリートを行い、ダイアログを閉じるときにオートコンプリートテキストボックスを DOM に戻します。サンプルは次のとおりです。

$("#autocom-div button").click(function(){
    $("#autocom-div #autocomplete").detach().dialog({
        close: function(){
            $(this).removeClass('ui-dialog-content ui-widget-content').removeAttr('style');
            $('#autocom-div button').before(this);
        }
    });
});

同じためのjsfiddleリンク：

http://jsfiddle.net/s24101984/EBduF/350/

問題: ボタンを 2 回クリックしたとき

4

1 に答える 1

1

問題はdetach()ではなくdialog()です。ダイアログの既存のインスタンスを破棄してから、別のインスタンスを作成する必要があります。destroy メソッドはdivwas Hosting も削除するため、最初に次のように複製する必要があります。

$("#autocom-div button").click(function()
{
    var parent = $("#autocom-div"),
        elm    = $("#autocomplete"),
        clone  = $("#autocomplete").clone();

    $("#autocomplete").detach().dialog({
         close: function(){
             parent.prepend(clone);
             $(this).dialog('destroy').remove();
         }
    });

});

jsfiddle

于 2013-04-10T21:52:40.050 に答える