从jQuery或vanilla javascript事件触发合成ExtJS事件

从jQuery或vanilla javascript事件触发合成ExtJS事件,javascript,jquery,events,extjs,extjs3,Javascript,Jquery,Events,Extjs,Extjs3,存在一个使用ExtJS 3.1实现的网站。 我想自动预填充一些字段。问题是,某些字段在自动填充时未经ExtJS验证。 我可以通过触发ExtJS的blur事件触发验证: field.fireEvent('blur', field); 然而,我不想这样做。我希望通过jQuery触发的正常事件触发该验证: $field.blur(); 我在这里的问题如下: 如何以与浏览器相同的方式触发文本框的模糊事件,以便同时运行ExtJS的事件处理程序 顺便说一句:我不想手动触发ExtJS事件的原因很简单:这个

存在一个使用ExtJS 3.1实现的网站。 我想自动预填充一些字段。问题是,某些字段在自动填充时未经ExtJS验证。
我可以通过触发ExtJS的blur事件触发验证:

field.fireEvent('blur', field);
然而,我不想这样做。我希望通过jQuery触发的正常事件触发该验证:

$field.blur();
我在这里的问题如下:
如何以与浏览器相同的方式触发文本框的模糊事件,以便同时运行ExtJS的事件处理程序

顺便说一句:我不想手动触发ExtJS事件的原因很简单:这个解决方案似乎适用于extja3.1,但不再适用于4.2,我不想为每个版本的ExtJS编写特殊的处理代码


如果你想玩一玩:
以下是URL:
在Chrome中打开它,打开Chrome的开发者控制台并粘贴以下文本:

delete console.log

var $city = jQuery('#ext-comp-1080');
var city = Ext.ComponentMgr.all.filterBy(function(x) { return x.isXType('combo') && x.id==='ext-comp-1080'; }).items[0];

var blurEventFireFn = city.events.blur.listeners[0].fireFn;

city.events.blur.listeners[0].fireFn = function(field) { console.log('ExtJS blur fired!'); blurEventFireFn(field); };
当您在City字段中单击,然后在其他一些字段中单击时,您将看到输出
ExtJS模糊被触发。执行
city.firevent('blur',city)时,您将看到相同的输出。但是,当您执行
$city.blur()时,将看不到该输出
$city.trigger('blur')

var event = document.createEvent('HTMLEvents');
event.initEvent('blur', true, true);
$city.get(0).dispatchEvent(event);

任何关于如何在普通事件和ExtJS事件之间建立这种桥梁的想法都将不胜感激。

用您的代码模拟本机事件确实有效(在非IE浏览器中):

但是,您应该避免这个问题,而不是通过使用字段的名称而不是模糊事件侦听器来解决它。这样,字段的
setValue
方法将触发其验证


如果你真的被它困住了,我会直接调用字段的方法,而不是通过模拟事件来增加(可能是脆弱的)复杂性层。这是由Ext添加到DOM中的处理程序。它出现在3.x和4.x中,并且不依赖于特定的浏览器…

我知道我的代码可以模拟本机事件。问题是它不会触发ExtJS事件。我也不能更改该网站的代码,我正在尝试创建一个用户脚本来简化一些任务。在字段上调用validate也不会产生所需的结果。尝试使用jQuery添加值,在字段上调用
validate
,然后单击“前进”按钮。它仍然说需要填写城市字段。代码$city.val('some value');city.validate()
var event = document.createEvent('HTMLEvents');
event.initEvent('blur', true, true);
$city.get(0).dispatchEvent(event);