有关禁止打开输入法:
ime-mode:disable这个属性在最新的Chrome下是无效的。
另外onchange事件并不能捕捉input控件内容的实时变化,也没办法通过重写onpaste事件禁止粘贴。
最后尝试了oninput事件,onchange事件和onkeyup事件共同控制输入框的值,基本上达到了预想的效果,意外的是oninput事件几乎可以达到屏蔽输入法的效果(可以打开输入法,但无法看到选择汉字的列表)。不过这是Html5才有的
在IE7、8里还是要加上ime-mode:disabled这个样式
下面是针对支持HTML5的浏览器的JS代码(需要引用jQuery):
/**只能输入数字**/
function addIntCheck(jqueryObj){
jqueryObj.keypress(function(e){
var k = window.event ? e.keyCode : e.which;
if (((k >= 48) && (k <= 57)) || k == 8 || k == 0) {
} else {
if (window.event) {
window.event.returnValue = false;
}
else {
e.preventDefault();
}
}
});
var domObj=jqueryObj.get(0);
domObj.οninput=function(){
domObj.value=domObj.value.replace(/\D/g,'');
};
domObj.οnkeyup=function(){
domObj.value=domObj.value.replace(/\D/g,'');
};
domObj.οnchange=function(){
domObj.value=domObj.value.replace(/\D/g,'');
};
}
/**只能输入数字或小数**/
function addFloatCheck(jqueryObj){
jqueryObj.keypress(function(e){
var k = window.event ? e.keyCode : e.which;
if (((k >= 48) && (k <= 57)) || k == 8 || k == 0 || k == 46) {
var htmlTxt=$(this).val();
if(!isNaN(htmlTxt) && htmlTxt.split(/\./).length==2 && k == 46){
if (window.event) {
window.event.returnValue = false;
}
else {
e.preventDefault();
}
}
} else {
if (window.event) {
window.event.returnValue = false;
}
else {
e.preventDefault();
}
}
});
var domObj=jqueryObj.get(0);
domObj.οninput=function(){
if(!domObj.value)
return;
if((/^\d*(\.){0,1}\d+/g.exec(domObj.value)))
domObj.value=(/^\d*(\.){0,1}\d*/g.exec(domObj.value))[0];
else
domObj.value="";
};
var domObj=jqueryObj.get(0);
domObj.οnchange=function(){
if(!domObj.value)
return;
if((/^\d*(\.){0,1}\d*/g.exec(domObj.value))[0];
else
domObj.value="";
};
domObj.οnkeyup=function(){
if(!domObj.value)
return;
if((/^\d*(\.){0,1}\d*/g.exec(domObj.value))[0];
else
domObj.value="";
};
}
/**只能输入字母或数字**/
function addCodeCheck(jqueryObj){
jqueryObj.keypress(function(e){
var k = window.event ? e.keyCode : e.which;
if ((( k >= 48 ) && ( k <= 57 )) || k == 8 || k == 0 || (( k >= 65 ) && ( k <=90 )) || (( k >= 97 ) && (k <=122 ))) {
} else {
if (window.event) {
window.event.returnValue = false;
}
else {
e.preventDefault(); //for firefox
}
}
});
var domObj=jqueryObj.get(0);
domObj.οninput=function(){
domObj.value=domObj.value.replace(/[^0-9a-zA-Z]+/g,'');
};
domObj.οnkeyup=function(){
domObj.value=domObj.value.replace(/[^0-9a-zA-Z]+/g,'');
};
domObj.οnchange=function(){
domObj.value=domObj.value.replace(/[^0-9a-zA-Z]+/g,'');
};
}
/**不能从键盘输入内容或选择历史输入**/
function forbidInput(jqueryObj){
jqueryObj.keypress(function(e){
if (window.event) {
window.event.returnValue = false;
}
else {
e.preventDefault(); //for firefox
}
});
var domObj=jqueryObj.get(0);
domObj.οnkeyup=function(){
domObj.value='';
};
jqueryObj.attr("autoComplete","off");
jqueryObj.attr("disableautocomplete","");
}
PS:我在Chrome下测试获得的输入事件发生顺序:
从键盘输入一个字符时,假设输入前的值是C,输入后的值是S:
事件 keydown input keypress keyup
值 C S S S
删除一个字符时
事件 keydown input keyup
值 S C C
多个字符一起删除时
事件 keydown input keyup
值 S S-s S-s
粘贴时
事件 keydown input keyup
值 S S+s S+s
其中需要注意的时,如果在退格删除操作时,对obj的keydown事件中对obj的值(obj.value)进行操作,会有一个奇怪的问题,即无法删除所有的内容。而在其他操作,比如粘贴时,在keydown操作前后,obj.value的值都不会发生改变。
所以,对键盘上的输入进行控制时,不要把逻辑写在keydown方法里