动态更改jQueryUI对话框按钮 [英] Dynamically changing jQueryUI dialog buttons

问题描述

试图动态更改多个jQuery UI dialog()按钮.

Attempting to change multiple jQuery UI dialog() buttons on the fly.

以下代码的问题在于，dialog()的第一个实例仅显示一个按钮.应该显示两个按钮.

The problem with below code is that only one button is displayed at the first instance of the dialog(). Two buttons should be displayed.

jsFiddle此处:

$(function(){
    var dlg = $('#message');

    dlg.dialog({
        autoOpen:false,
        modal:true,
        width: 500,
        close: function() {
            if (seen==0 && ans > 0) {
                cnt++;
                seen++;
                dlg.html('Here is a second message');
                dlg.dialog(
                    'option',
                    'buttons',
                        [{
                            text: 'OK',
                            click: function() {
                                $(this).dialog('close');
                            }
                        }]
                );
                dlg.dialog('open');
            }
        }
    });

    $('#myDiv').hover(
        function() {
            //Hover-in
            if (cnt < 1 || (cnt > 2 && cnt < 4) || (cnt > 5 && cnt < 7)) {

                var msg = 'First display text goes here';
                dlg.html(msg);
                dlg.dialog(
                    'option',
                    'buttons',
                        [{
                            text: 'Download',
                            click: function() {
                                ans++;
                                $(this).dialog('close');
                            },
                            text: 'Not now',
                            click: function() {
                                $(this).dialog('close');
                            }
                        }]
                );
                dlg.dialog('open');
            }
            cnt++;
        },
        function() {
            //Hover-out
            //need this to prevent duplicating hover-in code (double-display dlg)
        }
    );

}); //END document.ready

推荐答案

我尝试将Object类型用于

I have tried to use the Object type for the buttons and it works :

dlg.dialog(
    'option',
    'buttons', {
        "Download": function () {...},
        "Not now": function () {...}
    }
);

请参见更新后的jsFiddle

对象:键是按钮标签，值是单击相关按钮时的回调.

Object: The keys are the button labels and the values are the callbacks for when the associated button is clicked.

但是您在数组中出错，必须有一个对象数组，并且缺少{和}.

EDIT : But you had an error in your array, you must have an array of object and there were missing { and }.

'buttons', [
    {
        text: "Download",
        click: function () {...}
    },
    {
        text: "Not now",
        click: function () {...}
    }
]

请参见对jsFiddle的更正

这篇关于动态更改jQueryUI对话框按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！