将jQuery UI Dialog按钮更改为简单链接?

时间:2012-05-21 21:09:37

标签: jquery jquery-ui jquery-ui-dialog

我在jquery ui对话框中定义了一个自定义按钮:

$("#myDlg").dialog({
        modal: true,
        buttons: {
            'My Custom Link': function () {
                alert('my custom message');
            },
            'Close': function () {
                $(this).dialog('close');
            }
        }
    });

我想将“My Custom Link”按钮显示为html链接,而不是默认按钮样式。我怎样才能做到这一点?感谢。

1 个答案:

答案 0 :(得分:6)

默认的jQuery选项不支持添加链接..但是你可以在包装器中添加任何你想要的东西..见下文,

$(function() {
    $("#myDlg").dialog({
        modal: true,
        buttons: {
            'Close': function() {
                $(this).dialog('close');
            }
        }
    })
    .parent()
    .find('.ui-dialog-buttonset')
    .prepend('<a href="javascript:void(0);" id="myCustomLink">My Custom Link</a>');

    $('#myCustomLink').click(function () {
        alert('my custom message');
    });
});

DEMO