Question

我有以下工具栏，我想在工具栏的开头添加“按钮”一词： http://jsfiddle.net/yyzxW/

 <div id="toolbar1" data-dojo-type="dijit/Toolbar" style="background-color:inherit;background-image:none;border-bottom:0px;">
 <span data-dojo-type="dijit/ToolbarSeparator">Buttons:</span>
 <div data-dojo-type="dijit/form/Button" id="toolbar1.pan" data-dojo-props="iconClass:'PanIcon', showLabel:false">פאן</div>
            <div data-dojo-type="dijit/form/Button" id="toolbar1.copy" data-dojo-props="iconClass:'dijitEditorIcon dijitEditorIconCopy', showLabel:false">Copy</div>
            <div data-dojo-type="dijit/form/Button" id="toolbar1.paste" data-dojo-props="iconClass:'dijitEditorIcon dijitEditorIconPaste', showLabel:false">Paste</div>
            <!-- The following adds a line between toolbar sections-->
            <span data-dojo-type="dijit/ToolbarSeparator"></span>
            <div data-dojo-type="dijit/form/ToggleButton" id="toolbar1.bold" data-dojo-props="iconClass:'dijitEditorIcon dijitEditorIconBold', showLabel:false">Bold</div>
        </div>

另外，如果我像这样创建工具栏，我该如何编程：

 var toolbar = new Toolbar({
            id: "toolbar1",
            style: "background-color:inherit;background-image:none;border-bottom:0px;"
        });

        var btnPan = new ToggleButton({
            label: "Pan",
            id: controls.PAN,
            onClick: function () { deactivateControls(); },
            showLabel: true,
            iconClass: "ToolbarIcon Pan"
        });

        var btnZoomIn = new ToggleButton({
            label: "Zoom In",
            id: controls.ZOOM_IN,
            onClick: function () { activateControl(this.id); },
            showLabel: true,
            iconClass: "ToolbarIcon ZoomIn"
        });

        var btnZoomOut = new ToggleButton({
            label: "Zoom Out",
            id: controls.ZOOM_OUT,
            onClick: function () { activateControl(this.id); },
            showLabel: true,
            iconClass: "ToolbarIcon ZoomOut"
        });

        toolbar.addChild(btnPan);
        toolbar.addChild(btnZoomIn);
        toolbar.addChild(btnZoomOut);

Answer 1

查看我的jsfiddle http://jsfiddle.net/yyzxW/3/

的修改版本

将此样式放在div

中

 <div style='float:left;margin-top:3px;'>Buttons: </div>

对于编程代码，您可以使用dojo.create或put-selector在toolBar.containerNode中创建一个div，如

put(toolBar.containerNode, "div.yourClass", "Your text");

Answer 2

您可以创建一个禁用按钮。

<div data-dojo-type="dijit/form/Button" 
    data-dojo-props="'class': 'labelOnlyButton', disabled: true">Buttons:</div>

使用.labelOnlyButton创建css，使其看起来如您所愿。

Dojo - 如何向工具栏添加文本

2 个答案: