jQuery UI对话框链接而不是按钮

Sha*_* Le 3 jquery jquery-ui

我想添加一个按钮(默认支持)和链接jQuery UI对话框.如何在jQuery UI对话框中添加链接?在我的情况下,我喜欢保存按钮和取消链接.提前致谢.

Zac*_*cho 6

你必须按照你想要的方式设置按钮的样式,但这会注入一个链接并绑定点击甚至可以做你想要的.

$("#dialog").dialog({
    modal: true,
   open: function(event, ui){
            $('<a />', {
                'class': 'linkClass',
                text: 'Cancel',
                href: '#'
            })
            .appendTo($(".ui-dialog-buttonpane"))
            .click(function(){
                 $(event.target).dialog('close');
            });
    },
    buttons: {
        'Save': function() {
            //save code here.
        }
    }
});?
Run Code Online (Sandbox Code Playgroud)


小智 5

我的方法是用一个链接包装按钮,以便利用jquery ui css而不必设置链接的样式.

要访问该按钮,您需要在初始选项中为其分配一个ID.

$('#your-selector').dialog({
                        resizable: false,
                        height: 260,
                        closeOnEscape: true,
                        width: 475,
                        modal: true,
                        .....
                        buttons: [
                            {
                                text: "Continue Shopping",
                                id: "continue-d-btn",
                                click: function () { $(this).dialog("close"); }
                            },
                            {
                                text: "Checkout",
                                id: "checkout-d-btn"  // assign an id ! important

                            }
                        ],
                        open: function (event, ui) {
                               // this is where we add an icon and a link
                               $('#checkout-d-btn')
                                .wrap('<a href="[YOUR_LINK]" ></a>');

                        }

                    });
Run Code Online (Sandbox Code Playgroud)