隐藏 dijit.Dialog 的 Dojo 异常

Question

我有一个对话框，里面有一个表单。下面的代码只是我正在尝试做的一个例子。当你关闭一个 dijit.Dialog 时，如果你不递归地销毁他的 child ，你就不能重新打开它(使用相同的 ID)。

如果你不想破坏你的小部件，你可以这样做:

var createDialog = function(){
    try{
    // try to show the hidden dialog
        var dlg = dijit.byId('yourDialogId');
        dlg.show();
    } catch (err) {
    // create the dialog
        var btnClose = new dijit.form.Button({
           label:'Close',
           onClick: function(){
               dialog.hide();
           }
        }, document.createElement("button"));
        var dialog = new dijit.Dialog({
           id:'yourDialogId',
           title:'yourTitle',
           content:btnClose
        });
        dialog.show();
    }
}

我希望这能有所帮助，但是对于这段代码，抛出的错误是:

exception in animation handler for: onEnd (_base/fx.js:153)

Type Error: Cannot call method 'callback' of undefined (_base/fx.js:154)

我不得不说我对这个有点迷茫!这让我发疯^^

PS:对不起我的“法语”英语^^

Answer 1

我将向您介绍您最好的新 friend :dojo.hitch()

这允许您将 onClick 函数绑定(bind)到创建它的上下文。很有可能，当您在代码中按下按钮时，它会调用您的 .show() .hide() 形成全局窗口的上下文。 var dlg 绑定(bind)到您的 createDialog 函数，因此它的内部对全局窗口不可见，因此全局窗口将其视为 undefined。

这是我对您的代码所做更改的示例:

var createDialog = function(){

    // try to show the hidden dialog
    var dlg = dijit.byId('yourDialogId');
    dlg.show();

    // create the dialog
    var btnClose = new dijit.form.Button({
        label:'Close',
        onClick: function(){
            dojo.hitch(this, dlg.hide());
        }
    }, document.createElement("button"));
    dlg.domNode.appendChild(btnClose.domNode);
    var btnShow = new dijit.form.Button({
        label : 'Open',
        onClick : function() {
            dojo.hitch(this, dlg.show());
        }
    }, document.createElement("Button"));
    dojo.body().appendChild(btnShow.domNode);
};  

dojo.ready(function() {
    createDialog();
}); 

请注意使用 dojo.hitch() 将各种按钮的任何 future 调用或点击绑定(bind)到创建 dlg 的上下文，永远授予按钮的 onclick 方法访问 createDialog 函数内部，其中存在 var dlg。