1

我有以下脚本用于创建带有按钮的模式。我只有下面的第一行：

$.modal = function(options)
    {
        var settings = $.extend({}, $.modal.defaults, options),
            root = getModalDiv(),

            // Vars for resizeFunc and moveFunc
            winX = 0,
            winY = 0,
            contentWidth = 0,
            contentHeight = 0,
            mouseX = 0,
            mouseY = 0,
            resized, content = '', contentObj;

然后：

    var buttonsFooter = false;
    $.each(settings.buttons, function(key, value)
    {
        // Button zone
        if (!buttonsFooter)
        {
            buttonsFooter = $('<div class="block-footer align-'+settings.buttonsAlign+'"></div>').insertAfter(contentBlockWrapper);
        }
        else
        {
            // Spacing
            buttonsFooter.append('&nbsp;');
        }

这是我创建模态的方式：

$.modal({
                    title: title,
                    closeButton: true,
                    content: content,
                    complete: function () {
                        applyTemplateSetup();
                        $($('#main-form')).updateTabs();
                    },
                    width: 900,
                    resizeOnLoad: true,
                    buttons: {
                        'Submit' : function () {
                            formSubmitHandler($('#main-form'));
                        }
                    }
                });

我想做的是使用这个脚本来创建我的带有按钮的模式并动态分配按钮名称。但是，当我尝试用 javascript 变量的名称替换“提交”时，它不起作用。有谁知道我怎么能做我需要的？

4

2 回答 2

1

用变量名替换'Submit'不起作用的原因是因为以这种方式定义对象时不需要引号（除非名称包含一些特殊字符）。var obj = { 'Submit': function() { } }与 完全一样var obj = { Submit: function() { } }。

您会注意到您已经在传递给的对象中省略了这样的引号$.modal()。

然而，虽然你不能写

var myVariable = 'abc';
var obj = { myVariable: 3 };

...并期望obj.abc存在（obj.myVariable将存在），你可以写

var myVariable = 'abc';
var obj[myVariable]  = 3;

...并且obj.abc 将存在。

因此，您可以通过以下方式解决您的问题：

var buttons = { };

buttons[variableName] = function () {
   formSubmitHandler($('#main-form'));
};

$.modal({
   ...
   buttons: buttons
});
于 2012-04-26T12:08:48.560 回答
0

编辑： David Hedlund 打败了我回答，并提供了一个类似的答案，其中涉及的代码修改更少。他建议只分解按钮选项而不是整个选项变量。结束编辑

首先，将选项分解为一个变量：

var modalOpts = {
    title: title,
    closeButton: true,
    content: content,
    complete: function () {
        applyTemplateSetup();
        $($('#main-form')).updateTabs();
    },
    width: 900,
    resizeOnLoad: true,
    buttons: {
        'Submit' : function () {
            formSubmitHandler($('#main-form'));
        }
    }
};

$.modal(modalOpts);

然后将有问题的按钮从选项中分离出来，并使用方括号表示法来访问和写入属性：

var dynamicButtonName = 'Submit'; //Or whatever

var modalOpts = {
    title: title,
    closeButton: true,
    content: content,
    complete: function () {
        applyTemplateSetup();
        $($('#main-form')).updateTabs();
    },
    width: 900,
    resizeOnLoad: true,
    buttons: {}
};

modalOpts.buttons[dynamicButtonName] = function () {
    formSubmitHandler($('#main-form'));
};

$.modal(modalOpts);
于 2012-04-26T12:10:46.513 回答