ExtJS中调用focus方法无效的解决方法

原文出处: http://www.javatang.com/archives/2010/07/08/4916413.html
作者: Jet Mah from Java堂
声明: 可以非商业性任意转载, 转载时请务必以超链接形式标明文章原始出处、作者信息及此声明！

 

 

 

在ExtJS中用于盒型控件的BoxComponent（TextField、TextArea、CheckBox、ComboBox等的父类）提供了一个focus方法，用于控制光标的焦点。但是在调用该方法的时候往往会发现达不到预期的效果，很多时候根本没有办法来控制光标的焦点。

在BoxComponent文档中对focus方法的说明如下：

focus( [Boolean selectText], [Boolean/Number delay] ) : Ext.Component
Try to focus this component.

可以看到这个方法有两个可选的参数，第一个的含义是是否全选中所在的文本内容（默认为false），第二个是设置一个延迟的时间，单位是毫秒（默认为0，不延迟）。下面是两种调用的方法：

1. var textField = new Ext.form.TextField({
2. // 属性就省略了 ....
3. });
4. // 默认的调用
5. textField.focus();
6. // 设置延迟的调用
7. textField.focus(false, 100);
8. // 等同于上面的方式
9. textField.focus.defer(100, textField);

如果做一个测试的话可以发现使用后面两种方式之后就会达到预期的效果了，这是因为所有的可视控件需要一个渲染的时间的，如果不设置focus的延迟时间，则再调用focus方法的时候该控件还没有渲染完成，当时是不会成功了。

 

 

 

参考资料：关于window的中field的focus问题