如何刪除滾動條的組合框在extjs2

Question

我想刪除滾動條的COMBOX箱

       new Ext.form.ComboBox({ 
            name:'cmbRating', 
            id:'cmbRat', 
            store: new Ext.data.SimpleStore({ 
             fields: ["wordRating","wordRatingValue"], 
             data: [["0","XXXX Word"],["1","AAAAA Word"],["2","SSSSS Word"]] 
            }), 
            displayField:'wordRatingValue', 
            valueField:"wordRating", 
            mode: 'local', 
            triggerAction: 'all', 
            forceSelection: true, 
            editable: false, 
            allowBlank: false, 
            blankText: 'Plase choose a rating.', 
            fieldLabel: '*Rating', 
            anchor: '90%' 
           }) 

這是我使用的代碼，在當地的IE11瀏覽器沒有滾動條，當我部署相同的未來在我們的測試環境中我得到的滾動條這樣 事情請建議我如何解決這個問題

Answer 1

對於ExtJS的2，您可以通過應用自定義列表CSS類的listClass做配置和設置類強制overflow: hidden風格是這樣的：

Ext.onReady(function() { 
 
    new Ext.form.ComboBox({ 
 
    renderTo: 'comboContainer', 
 

 
    name:'cmbRating', 
 
    id:'cmbRat', 
 
    store: new Ext.data.SimpleStore({ 
 
     fields: ["wordRating","wordRatingValue"], 
 
     data: [["0","XXXX Word XXX XXX XXXXXXXX XXXXX AAAAA"],["1","AAAAA Word"],["2","SSSSS Word"],["3","XXXX Word"],["4","AAAAA Word"],["5","SSSSS Word"],["6","XXXX Word"],["7","AAAAA Word"],["8","SSSSS Word"],["0","XXXX Word"],["1","AAAAA Word"],["2","SSSSS Word"],["3","XXXX Word"],["4","AAAAA Word"],["5","SSSSS Word"],["6","XXXX Word"],["7","AAAAA Word"],["8","SSSSS Word 1"]] 
 
    }), 
 
    displayField:'wordRatingValue', 
 
    valueField:"wordRating", 
 
    mode: 'local', 
 
    triggerAction: 'all', 
 
    forceSelection: true, 
 
    editable: false, 
 
    allowBlank: false, 
 
    blankText: 'Plase choose a rating.', 
 
    fieldLabel: '*Rating', 
 
    anchor: '90%', 
 
    listClass: 'x-combo-hide-scrollbars' 
 
    }); 
 
});

.x-combo-hide-scrollbars .x-combo-list-inner { 
 
    overflow: hidden !important; 
 
}

<link rel="stylesheet" type="text/css" href="http://zikro.gr/dbg/html/extjs/extjs-2.2.1/css/ext-all.css" /> 
 
<script type="text/javascript" src="http://zikro.gr/dbg/html/extjs/extjs-2.2.1/adapter/ext/ext-base.js""> </script> 
 
<script type="text/javascript" src="http://zikro.gr/dbg/html/extjs/extjs-2.2.1/ext-all.js""> </script> 
 
<div id="comboContainer"></div>

我的ExtJS的2例：http://zikro.gr/dbg/html/extjs/combo-hide-scroll-extjs2.html

---

對於ExtJS的4，有autoScroll參數允許啓用或禁用滾動條ARS如果我們把它應用到listConfig參數：

Ext.onReady(function() { 
 
    new Ext.form.ComboBox({ 
 
    renderTo: 'comboContainer', 
 

 
    name:'cmbRating', 
 
    id:'cmbRat', 
 
    store: new Ext.data.SimpleStore({ 
 
     fields: ["wordRating","wordRatingValue"], 
 
     data: [["0","XXXX Word XXX XXX XXXXXXXX XXXXX AAAAA"],["1","AAAAA Word"],["2","SSSSS Word"],["3","XXXX Word"],["4","AAAAA Word"],["5","SSSSS Word"],["6","XXXX Word"],["7","AAAAA Word"],["8","SSSSS Word"],["0","XXXX Word"],["1","AAAAA Word"],["2","SSSSS Word"],["3","XXXX Word"],["4","AAAAA Word"],["5","SSSSS Word"],["6","XXXX Word"],["7","AAAAA Word"],["8","SSSSS Word"]] 
 
    }), 
 
    displayField:'wordRatingValue', 
 
    valueField:"wordRating", 
 
    mode: 'local', 
 
    triggerAction: 'all', 
 
    forceSelection: true, 
 
    editable: false, 
 
    allowBlank: false, 
 
    blankText: 'Plase choose a rating.', 
 
    fieldLabel: '*Rating', 
 
    anchor: '90%', 
 
    listConfig: { 
 
     autoScroll: false 
 
    } 
 
    }); 
 
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/extjs/4.2.1/resources/ext-theme-classic/ext-theme-classic-all.css" rel="stylesheet" /> 
 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/extjs/4.2.1/ext-all.js"></script> 
 
<div id="comboContainer"></div>

我的ExtJS的4例如：http://zikro.gr/dbg/html/extjs/combo-hide-scroll.html