如何删除 extjs2 中组合框的滚动条

Question

我想删除组合框的滚动条

                                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 class 应用到 listClass ComboBox 配置来实现并设置 class 以强制使用这样的 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 parameter that allows to enable or disable the scrollbars if we apply it to the 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

如何删除 extjs2 中组合框的滚动条

How to remove scrollbars for a combobox in extjs2

extjs

extjs4

extjs4.1

extjs2