如何在jQuery对话框标题栏中添加额外的按钮

G Naga Subrahmanyam 发表于 Dev

纳迦·苏普拉曼尼亚姆（G Naga Subrahmanyam）

如何在jQuery对话框标题栏中添加额外的按钮

我想向jQuery对话框标题栏添加额外的按钮。我想向jQuery对话框标题栏添加最少5个按钮。最大值为“ N”。

如下所示的按钮：

帮助按钮
最大化按钮
最小化按钮
关于按钮

 $( ".dialog" ).dialog({
       autoOpen: false,
       buttons: [
            {
                text: "Minimize",
                icon: "ui-icon-minimize",
                click: function( e ) {
                    //function
                }
            },
            {
                text: "Maximize",
                icon: "ui-icon-maximize",
                click: function( e ) {
                   //function
                }
            }
        ]
    });

南瓜

要添加更多按钮，只需在buttons数组中添加它们

$( ".dialog" ).dialog({
       autoOpen: false,
       buttons: [
            {
                text: "Help",
                icon: "ui-icon-help",
                click: function( e ) {
                   //function
                }
            },
            {
                text: "Minimize",
                icon: "ui-icon-minimize",
                click: function( e ) {
                    //function
                }
            },
            {
                text: "Maximize",
                icon: "ui-icon-maximize",
                click: function( e ) {
                   //function
                }
            },
            {
                text: "About",
                icon: "ui-icon-about",
                click: function( e ) {
                   //function
                }
            }
        ]
    });

在这里看到一个例子

- - 编辑 - -

现在，我知道您要做什么。.我认为没有干净的方法可以这样做，所以我建议这样做：

$( ".dialog" ).dialog({
       autoOpen: true,
       buttons: [
            {
                text: "Minimize",
                icon: "ui-icon-minimize",
                click: function( e ) {
                    //function
                }
            },
            {
                text: "Maximize",
                icon: "ui-icon-maximize",
                click: function( e ) {
                   //function
                }
            }
        ],
        create: function( event, ui ) {
            $('.ui-dialog-buttonset').prependTo('.ui-dialog-titlebar');
        }
    });