如何确定何时在 ExtJS 7.0.0 中单击了工具栏答案

【问题标题】：How to determine when a toolbar has been clicked in ExtJS 7.0.0如何确定何时在 ExtJS 7.0.0 中单击了工具栏
【发布时间】：2022-08-19 00:07:04
【问题描述】：

我想检测工具栏上的点击，或者工具栏的焦点。

用例是从具有工具栏的 LiveSearchGrid 中提取的，在代码中可以看到。提供的代码渲染良好，但没有检测到点击、焦点或其他任何内容。根本不值一提。

见下文：

<div id=\"toolbar\"></div>
<script type=\"text/javascript\">
    Ext.create(\'Ext.toolbar.Toolbar\', {
        renderTo: \'toolbar\',
        name: \'searchBar\',
        focusEl: \'toolbar\',
        listeners: {
            focusenter: function () {
                console.log(\'focusenter\')
            },
            focus: function () {
                console.log(\'focus\')
            }
        },
        items: [
            {
                xtype: \'tbtext\',
                html:  \'Search\',
                listeners: {
                    focusenter: function () {
                        console.log(\'focusenter\')
                    }
                }
            },
            \'Case Sensitive\'
        ]
    })  
</script>

以下是解决我的问题的纯 JavaScript。

document.getElementById(\'toolbar\').onclick = function () {
    console.log(\'hello world\');
}

我究竟做错了什么？

见stackoverflow.com/questions/20852355/…

标签： extjs

【解决方案1】：

div 的 ID 为“工具栏”：

<div id="toolbar"></div>

在 JS 中，您将获得具有不同 ID“toolbar-1001”的元素。因此，要解决此问题，只需确保这些 ID 匹配：

<div id="toolbar-1001"></div>

【讨论】：

ID 是由 Ext-JS 生成的，你不能依赖它。