javascript - ExtJs 4.1.1 复选框呈现为按钮，需要正常复选框

Question

我正在使用 ExtJs 4.1.1 并希望将普通复选框呈现在 div 中，但使用以下代码将其呈现为按钮。我检查了 ExtJs 源中的 Ext.form.field.Checkbox 并在其中找到了一个fieldSubTpl属性的评论，上面写着

// Creates not an actual checkbox, but a button which is given aria role="checkbox" (If ARIA is required) and
// styled with a custom checkbox image. This allows greater control and consistency in
// styling, and using a button allows it to gain focus and handle keyboard nav properly.

如果是这种情况，那么获得正常复选框的方法是什么？

 Ext.create('Ext.container.Container',{
            id: 'myContainer',
            width: 100,
            renderTo: 'chekboxId',

            items: [{
                 xtype:'checkboxgroup',
                 id:'chekcboxGrpId',
                 items:[
                    {

                         boxLabel: 'Text check box',                     
                     name : 'MyCheckBox',
                     inputValue: 'true',
                     checked: true

                    }

                 ]

            }]
        })

Answer 1

我认为问题在于您没有将 css/images 包含到您的项目 中，这是示例

css

<link rel="stylesheet" href="http://cdn.sencha.io/try/extjs/4.1.1/resources/css/ext-all-gray.css">

HTML

    <div id="checkbox"></div>

Javascript

Ext.onReady(function(){
    var panel = Ext.create('Ext.panel.Panel', {
        items: {
            xtype: 'fieldcontainer',
            fieldLabel: 'Toppings',
            defaultType: 'checkbox',
            items: [
                {
                    boxLabel  : 'Anchovies',
                    name      : 'topping',
                    inputValue: '1',
                    id        : 'checkbox1'
                }
            ]
        }
    });
    panel.render('checkbox');
})