使用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();