ExtJS4 - 文本框之 maxLength ，阻止用户输入过多的字符

各位使用过ExtJs4的小伙伴应该知道，设置了文本框的 maxLength 后，该属性仅能起到验证的作用，不能阻止用户输入过多的字符

而在普通html文本框中，设置了文本框的 maxLength 后，用户无法输入更多的字符，不管是键盘输入，还是粘贴

如果希望前者达到后者的效果，有两种方法：

1. 设置该文本框的 inputAttrTpl 属性，这仅对该文本框起效，示例：

    inputAttrTpl: "maxLength=50"

2. 修改ExtJS源码，这可以对所有的文本框起效

    ext-all-***.js

    找到： Ext.cmd.derive("Ext.form.field.Text" 代码片段，向下找到其 initComponent 方法，在方法最前面加上一段代码，修改后如下：

initComponent : function() {
// 处理 text 的 maxLength
var maxLen = this.maxLength!=null && this.maxLength<Number.MAX_VALUE?parseInt(this.maxLength):null;
if(maxLen!=null && !isNaN(maxLen)) {
var inAttr = this.inputAttrTpl;
var s = " maxLength='"+this.maxLength+"'";
if(inAttr==null || inAttr=="") {
inAttr = s;
} else if(Ext.isString(inAttr) && inAttr.indexOf(s)<0) {
inAttr = inAttr+s;
} else if(Ext.isArray(inAttr)) {
var flag = false;
var len= inAttr.length;
for(var i=0;i<len;i++) {
if((""+inAttr[i]).indexOf(s)>=0) {
flag = true;
break;
}
}
if(!flag) {
inAttr.push(s);
}
} else {
// TODO: XTemplate 暂处理为：调用者自己定义 XTemplate： maxLength='...'
}
this.inputAttrTpl = inAttr;
}

                ...

    

   

对于 inputAttrTpl 被设置为 Ext.XTemplate 类型的情况，我暂没尝试出解决办法，这种情况比较少见，如果有，暂时只能请调用者在定义 inputAttrTpl  时，将 maxLength=... 加入进去；

如果有哪位小伙伴解决了这个问题，或者另外有更好的方案，请跟帖