jQueryUI对话框未关闭

我想我这样做是对的，但两个按钮实际上都没有关闭。要么我是瞎子，要么我错过了一个微妙之处

HTML

---

我开始尝试跟随和修改流程。

显然，将按钮单击处理程序包装在

$（function（）{…}）

中会导致在函数创建对话框后执行该处理程序。对话框中的按钮是，

s，因此单击它们将关闭对话框，但单击处理程序会立即重新打开对话框。它在没有额外的

$（function（）{…}）

的情况下工作，这应该不是必需的：

---

您还可以通过更具体地选择应打开对话框的按钮来解决此问题。但是一个单独的

$（document）.ready（function{…}）

或

$（function（）{…}）

（它们做同样的事情）就足够了。

@JasonP:谢谢。第一次没有得到正确的“可共享”链接。bit的另一个答案是通过向“原始”按钮添加id来演示修复方法，但它已被删除。我的教训是在玩的时候要更加小心地使用函数包装器。非常感谢。

<div id="sample-dialog" title="New Effect"></div>
<button>Button</button>

$(document).ready(function () {
    $(function () {

        $(function () {
            $("button")
                .button()
                .click(function (event) {
                event.preventDefault();
                $("#sample-dialog").dialog("open");
            });
        });

        $("#sample-dialog").dialog({
            autoOpen: false,
            height: 200,
            width: 200,
            modal: true,
            buttons: {
                "Close by $(#id)": function () {
                    $("#sample-dialog").dialog("close");
                },
                    "Close by $(this)": function () {
                    $(this).dialog("close");
                }
            }
        });

    });

});

$(document).ready(function () {
    $("button")
        .button()
        .click(function (event) {
        event.preventDefault();
        $("#sample-dialog").dialog("open");
    });

    $("#sample-dialog").dialog({
        autoOpen: false,
        height: 200,
        width: 200,
        modal: true,
        buttons: {
            "Close by $(#id)": function () {
                $("#sample-dialog").dialog("close");
            },
                "Close by $(this)": function () {
                $(this).dialog("close");
            }
        }
    });
});