javascript - javascript / jQuery 使用 var 作为属性 id

Question

我想在我的代码中使用翻译，它们来自 PHP/MySql 并被转换为 javascript 数组：

var translate = <?= json_encode($Object->translate);?>;

翻译可用 Javascript（已测试）。

现在，我想在我的 Javascript 代码中使用它们，例如 Jquery UI 对话框：

$("#logoff").click(function(){  
    var action = "logoff"; 
    var btnLogoff = translate["dialog/buttonLogoff"]; // this gives the translation from the array
    var btnCancel = translate["dialog/buttonCancel"]; // this gives the translation from the array
    $("#dialog").dialog(
        {
            title: translate["dialog/titleLogoff"],
            modal: true,
            resizable: false,
            buttons: {
                btnLogoff : function() {
                        var loadUrl = "includes/_ajax/actions.ajax.php";
                        $.post(loadUrl,{action:action}, function(data) {
                            if(data)
                                location.reload();
                        });
                        $( this ).dialog( "close" );
                },
                btnCancel: function() {
                        $( this ).dialog( "close" );
                }
            }
        }
    );
    $("#dialog").html("<span class='ui-icon ui-icon-alert' style='float: left; margin: 0 7px 20px 0;'></span>" + translate["dialog/textLogoff"]);    
});  

问题在于属性 btnLogoff 没有显示翻译后的文本，而是显示自身（“btnLogoff”）。

在最后一节中， translate["dialog/textLogoff"] 被翻译成应有的样子。我显然做错了什么。我可以使用 var 作为属性 ID 吗？如何？

Answer 1

我认为您没有完全使用 jQuery.dialog API。请参阅http://api.jqueryui.com/dialog/#option-buttons

尝试使用按钮配置的“文本”属性：

$("#dialog").dialog(
    {
        title: translate["dialog/titleLogoff"],
        modal: true,
        resizable: false,
        buttons: [
            {
                text : btnLogoff,
                click : function() {
                    var loadUrl = "includes/_ajax/actions.ajax.php";
                    $.post(loadUrl,{action:action}, function(data) {
                        if(data)
                            location.reload();
                    });
                    $( this ).dialog( "close" );
                }
            }
            ,
            {
                text : btnCancel,
                click: function() {
                    $( this ).dialog( "close" );
                }
            }
        ]
    }
);