是否所有ExtJS组件都没有点击事件

我正在学习extjs 4.1，但我在大多数组件上都找不到点击事件——我是盲人，或者除了按钮之外，我无法对点击其他组件做出反应

---

原因是什么？HTML支持单击所有元素。

渲染后，通过访问几乎所有可见组件都包含的对象，可以非常轻松地添加任何DOM事件

只需向afterrender事件添加一个侦听器，该事件将您想要的事件添加到dom对象

Ext.create('Ext.panel.Panel', {
    // other panel configs ...
    listeners: {
       'afterrender': function(panel) {
           panel.el.on('click', function() {
               alert('clicked');
           });
        }
    }
});

---

我认为还有一种方法可以用于扩展所有可见组件的类的所有组件。我以前没有这样做过，所以您必须仔细考虑一下。

通过访问几乎所有可见组件在渲染后都包含的对象，您可以非常轻松地添加任何DOM事件

只需向afterrender事件添加一个侦听器，该事件将您想要的事件添加到dom对象

Ext.create('Ext.panel.Panel', {
    // other panel configs ...
    listeners: {
       'afterrender': function(panel) {
           panel.el.on('click', function() {
               alert('clicked');
           });
        }
    }
});

---

我认为还有一种方法可以用于扩展所有可见组件的类的所有组件。我以前没有这样做过，因此您必须处理它。

每个组件都可以在元素级别公开单击事件。某些组件（如Ext.button.button）在组件级别具有单击事件

以下是在面板上添加单击事件的好方法：

  new Ext.panel.Panel({
      listeners: {
          click: this.handlePanelClick,
          element: 'el'
      }
  });

编辑以回应评论

元素字符串是组件属性的任意元素

new Ext.panel.Panel({
listeners: {
    click: function() {
        alert('you clicked the body');
    },
    element: 'body'
}

})

---

Ext文档有更详尽的解释

每个组件都可以在元素级别公开click事件。某些组件（如Ext.button.button）在组件级别具有单击事件

以下是在面板上添加单击事件的好方法：

  new Ext.panel.Panel({
      listeners: {
          click: this.handlePanelClick,
          element: 'el'
      }
  });

编辑以回应评论

元素字符串是组件属性的任意元素

new Ext.panel.Panel({
listeners: {
    click: function() {
        alert('you clicked the body');
    },
    element: 'body'
}

})

---

Ext文档使用自引用托管侦听器提供了更全面的解释

：

Ext.create('Ext.panel.Panel', {
    listeners: {
       'afterrender': function(panel) {
           this.mon(this.getEl(), 'click', this.onClick, this)
        }
    },
    onClick: function() {
        alert("mmm mon mon mon");
    }
});

---

使用自引用的托管侦听器：

Ext.create('Ext.panel.Panel', {
    listeners: {
       'afterrender': function(panel) {
           this.mon(this.getEl(), 'click', this.onClick, this)
        }
    },
    onClick: function() {
        alert("mmm mon mon mon");
    }
});

---

如果您只收听click事件，也可以这样做

    xtype: 'container',
    listeners: {
         el: {
             click: function() {
                  alert('I clicked');
              },
              scope: this
             }
     }

---

如果需要侦听Ext.dom.Element未触发的事件，则需要像其他人建议的那样将其附加到“渲染”侦听器中。

如果只侦听单击事件，也可以执行此操作

    xtype: 'container',
    listeners: {
         el: {
             click: function() {
                  alert('I clicked');
              },
              scope: this
             }
     }

---

如果需要侦听Ext.dom.Element未触发的事件，则需要像其他人建议的那样，将其附加到“渲染”侦听器中。

需要单击事件的组件具有这样的事件，如。你指的到底是什么组件？面板，组合框。。。具有图形表示的每个组件都需要单击事件单击面板和组合框由ExtJS在内部处理，因为ExtJS定义了用户单击面板、其标题、工具按钮等或组合框或其触发器时发生的各种行为。你把它和dom元素混淆了吗？我没有混淆任何东西-为什么我不能把我自己的句柄放在同样由ExtJS处理的事件上？这是因为ExtJS组件不能解析为单个dom元素。事实上，它可以由几十个这样的东西组成。因此，面板上的单击并没有精确定义-单击何处？关于内容？在标题栏上？在工具栏上？页脚？可调整大小的布局中的拖动处理程序？ExtJS组件需要响应各种点击事件来完成任务。您可以始终钩住dom元素事件click，就像您接受的答案一样。你指的到底是什么组件？面板，组合框。。。具有图形表示的每个组件都需要单击事件单击面板和组合框由ExtJS在内部处理，因为ExtJS定义了用户单击面板、其标题、工具按钮等或组合框或其触发器时发生的各种行为。你把它和dom元素混淆了吗？我没有混淆任何东西-为什么我不能把我自己的句柄放在同样由ExtJS处理的事件上？这是因为ExtJS组件不能解析为单个dom元素。事实上，它可以由几十个这样的东西组成。因此，面板上的单击并没有精确定义-单击何处？关于内容？在标题栏上？在工具栏上？页脚？可调整大小的布局中的拖动处理程序？ExtJS组件需要响应各种点击事件来完成任务。您可以始终挂接dom元素事件单击，如您接受的答案所示。此配置中元素参数的其他选项是什么？此配置中元素参数的其他选项是什么？我很好奇，为什么您认为这是最干净的。而且，这似乎是对mon的滥用。mon用于在项目被销毁时删除侦听器，因为元素将在组件被销毁时被销毁，所以在这里它不做任何额外的事情

---

un-shorthand for remove managed listener文档中的un-shorthand for addManagedListener将监听器添加到任何可观察对象或Ext.元素中，这些对象或元素在该组件被销毁时会自动删除。我很好奇为什么您认为这是最干净的。而且，这似乎是对mon的滥用。mon用于在项目被销毁时删除侦听器，因为元素将在组件被销毁时被销毁，所以在这里它不做任何额外的操作。您正在考虑使用mun作为remove managed listenerum no的缩写，从docs:mon中，addManagedListener的缩写将侦听器添加到任何可观察的对象或Ext.元素中，当该组件被销毁时，这些对象或元素会自动删除。