ExtJS拖动事件侦听器在Chrome和Firefox上的工作方式不同

Question

我在Window的标题栏（标题）中添加了一个输入字段。在Chrome上选择和编辑输入字段有效，我仍然可以拖动窗口。在Firefox上我可以在视口周围拖动窗口，但我无法选择输入字段并进行编辑。我该如何更正此代码，以便它可以在两个浏览器上运行？

快速解决问题：

Ext.define('Demo.DemoWindow', {
    extend: 'Ext.window.Window',
    xtype: 'demowindow',

    height: 300,
    width: 400,
    title: 'Window',
    autoShow: true,
    items: [{
            xtype: 'button',
            text : 'Press!',
            listeners: {
              click: function() {
               var win = this.up('window');
               var header = win.getHeader();
               header.setTitle('');

               var killDrag = false;
               var dragEvent = win.dd.on({
                 beforedragstart: function(dd, e) {
                   if (killDrag) {
                     return false;
                   }
                 }
               });

               var field = Ext.create('Ext.form.field.Text', {
                 name: 'Title',
                 allowBlank: false,
                 value: 'Type here something!',
                 listeners: {
                   el: {
                     delegate: 'input',
                     mouseout: function() {
                       killDrag = false;
                     },
                     mouseenter: function() {
                       killDrag = true;
                     }
                   }
                 }
                });

                header.insert(0, field);

              }
            }
    }]
});

Ext.application({
    name: 'Demo',
    launch: function() {
        Ext.create('Ext.container.Viewport', {
            layout: 'absolute',
            items: [
                {
                    xtype: 'demowindow',
                    x: 20,
                    y: 20,
                }
            ]
        });
    }
});

Answer 1

使用mouseover事件代替mouseenter似乎与两者兼容。