jQuery UI对话框:如何确认用户确认或取消UI对话框。

时间:2013-06-14 14:35:13

标签: javascript jquery jquery-ui events dialog

我有code

HTML:

<div id="dialog-first"></div>
<div id="dialog-second"></div>
<div id="dialog-third"></div>
<div id="menu">
    <ul>
        <li id="first"><a href="#first">first</a></li>
        <li id="second"><a href="#second" class="confirm">second (need confirm)</a></li>
        <li id="third"><a href="#third" class="confirm">third (need confirm)</a></li>
    </ul>
</div>

Javascript第1部分:

$('li a.confirm').live('click', function (e) {

    e.preventDefault();
    var id = $(this).parent('li').attr('id');
    $('#dialog-' + id).dialog({
        dialogClass: 'ui-dialog-confirm',
        buttons: {
            "Confirm": function () {
                /*window.location.href = $(this).attr('href');*/
                $(this).dialog("close");
            },
                "Cancel": function () {
                $(this).dialog("close");
            }
        }
    });

});

Javascript第2部分:

$('#menu li').each(function () {
    var id = $(this).attr('id');
    $('#dialog-' + id).on("dialogclose", function (event, ui) {
        //How can I check what user clicked, Confirm or Cancel ???
        //Is it possible
        console.log(event);
    });
});

如何查看用户点击的内容,确认或取消???

如果可能,我想只更改Javascript part2。

1 个答案:

答案 0 :(得分:0)

将按钮代码的结构更改为:

buttons: [{
    text: "Confirm",
    click: function () {
        $(this).dialog("close");
        console.log('confirm')
    }
}, {
    text: "Cancel",
    click: function () {
        $(this).dialog("close");
        console.log('cancel')
    }
}]

然后您可以轻松访问每个按钮的点击事件。

<强> jsFiddle example