javascript - jQueryでモーダルダイアログを設定すると、ドロップダウンが機能しなくなります

Question

次のHTMLがあるとしましょう。

<select>
    <option>a</option>
    <option>a</option>
    <option>a</option>
    <option>a</option>
</select>​

そして次のJavaScript：

$("<div>").dialog({
    modal: true
});
//... some other code
$(".ui-widget-overlay").remove(); //remove what makes the modal dialog `modal`

何らかの理由でドロップダウンから選択しようとすると、機能しなくなります...

これを修正するにはどうすればよいですか？

Chrome 22.0.1229.94（公式ビルド161065）を使用していますm

デモ： http： //jsfiddle.net/maniator/gATRg/

Answer 1

オーバーレイが作成されると、クリックを妨げるいくつかのイベントがドキュメントにバインドされます。オーバーレイはそれ自体がウィジェットであり、ダイアログにはそのウィジェットへの参照が格納されます。オーバーレイを「正しい」方法で破棄すると、探している動作が得られます。

このフィドルを参照してください：http： //jsfiddle.net/Waxen/gATRg/6/

コード：

var div = $("<div>")

div.dialog({
    modal: true
});

div.data().dialog.overlay.destroy();