Question

我在ExtJs框架中编写了一个填充了项目的组合框。当用户将鼠标悬停在项目上时，我无法获得工具提示。

以下是代码：

$formPanel .= " new Ext.form.ComboBox({
                tpl:'<tpl for =\".\"><div ext:qtip=\"{abbr}\" class=\"x-combo-list-item\">{state}</div></tpl>',
id:'type_blackout_weekly',
  store: sstore,
  displayField:'state',
  typeAhead: true,
  mode: 'local',
  triggerAction: 'all',
  emptyText:'Select a state...',
  selectOnFocus:true,
  forceSelection: true,
  width:135
}),";

var statedata = [
  ['AL', 'Alabama'],
  ['AK', 'Alaska'],
  ['AZ', 'Arizona'],
  ['WV', 'West Virginia'],
  ['WI', 'Wisconsin'],
  ['WY', 'Wyoming']
];

var sstore = new Ext.data.SimpleStore({
  fields: ['abbr', 'state'],
  data : statedata 
});

非常感谢任何指导。

Answer 1

我假设您使用this example（该页面上的第二个）作为起点？ tpl应该引用一个有效的模板，如示例中所示（当然，看起来你正在使用“abbr”而不是样本中的“nick” - 确保所有数据字段都匹配）。您定义的模板未定义任何工具提示标记。 E.g：

'<tpl for="."><div ext:qtip="{state}. {nick}" class="x-combo-list-item">{state}</div></tpl>'

如果它仍然无效，请确保在代码之前的某处初始化快速提示单例：

Ext.QuickTips.init();

Answer 2

只需删除for和等号之间的空格，应为：

<tpl for=".">

Answer 3

请用我的答案，因为我从未使用过ExtJS。我对组合框的体验是我测试的浏览器（IE6 / 7，Firefox 3.0）在将鼠标悬停在框的选项上时没有触发onMouseOver事件，也没有显示标题属性值。

当然，这仅适用于vanilla HTML组合框（选择具有multiple =“true”的元素）。如果ExtJS有自定义组合框，请忽略我的答案。：）

未显示组合框项目工具提示

3 个答案: