1、需求
在ie8及以上版本浏览器中,输入框只能输入大小写字母、数字、空格。
2、阶段一
js代码:
/**
* 只能是英文和数字以及空格 <input onkeydown="onlyEngNumSpace();">
*/
function onlyEngNumSpace() {
//alert(event.keyCode + "event.shiftKey=" + event.shiftKey);
if ((event.keyCode >= 48 && event.keyCode <= 57)
|| (event.keyCode >= 96 && event.keyCode <= 105)) {
if(event.shiftKey) {
// 按下了shift组合键
event.returnValue = false;
}
// 考虑小键盘上的数字键
} else if (event.keyCode >= 65 && event.keyCode <= 90) {
// 考虑大小写字母键
} else if (event.keyCode == 8) {
// backspace键
} else if (event.keyCode == 46) {
// delete键
} else if (event.keyCode == 37) {
// 左方向键
} else if (event.keyCode == 39) {
// 右方向键
} else if (event.keyCode == 32) {
// 空格
} else {
event.returnValue = false;
}
}
3、阶段二
经测试在中文输入法时敲击键盘字母键后无法输入字母,后增加js提示切换输入法(js代码红色部分)。经测试效果不太理想,有时会不停的弹出提示好多次。
最后在jsp的input中增加style设置(jsp代码红色部分),直接禁止表单使用文本框输入法。
jsp代码:
<input id="partNum_01" class="row_complete_txt_5" type="text" style="ime-mode:disabled;"
onKeyDown="onlyEngNumSpace();" onKeyUp="textUp(this, 3);"
onfocus="effectTxtFocus(this, '', '');"
onblur="effectTxtBlur(this, '', '');" />
js代码:
/**
* 只能是英文和数字以及空格 <input onkeydown="onlyEngNumSpace();">
*/
function onlyEngNumSpace() {
//alert(event.keyCode + "event.shiftKey=" + event.shiftKey);
if (event.keyCode === 229) {
event.returnValue = false;
// 提示切换输入法
//window.parent.bootbox_alert("请您先将输入法切换至英文后,再继续输入数字和字母。");
console.log("onlyEngNum,请您先将输入法切换至英文后,再继续输入数字和字母。");
} else if ((event.keyCode >= 48 && event.keyCode <= 57)
|| (event.keyCode >= 96 && event.keyCode <= 105)) {
if(event.shiftKey) {
// 按下了shift组合键
event.returnValue = false;
}
// 考虑小键盘上的数字键
} else if (event.keyCode >= 65 && event.keyCode <= 90) {
// 考虑大小写字母键
} else if (event.keyCode == 8) {
// backspace键
} else if (event.keyCode == 46) {
// delete键
} else if (event.keyCode == 37) {
// 左方向键
} else if (event.keyCode == 39) {
// 右方向键
} else if (event.keyCode == 32) {
// 空格
} else {
event.returnValue = false;
}
}
4、阶段三
经测试ie11下上述js控制无效,通过分析发现window.event.returnVaue=false;这句话并不能阻止字符输入到输入框中。
查了一下资料,一种粗糙的解法是在window.event.returnValue=false;后面再加一句:if (window.event.preventDefault) window.event.preventDefault();
这样可以阻止字符输入到输入框(js代码红色部分)。
js代码:
/**
* 只能是英文和数字以及空格 <input onkeydown="onlyEngNumSpace();">
*/
function onlyEngNumSpace() {
//alert(event.keyCode + "event.shiftKey=" + event.shiftKey);
if (event.keyCode === 229) {
event.returnValue = false;
if (window.event.preventDefault) {
window.event.preventDefault();
}
// 提示切换输入法
//window.parent.bootbox_alert("请您先将输入法切换至英文后,再继续输入数字和字母。");
console.log("onlyEngNum,请您先将输入法切换至英文后,再继续输入数字和字母。");
} else if ((event.keyCode >= 48 && event.keyCode <= 57)
|| (event.keyCode >= 96 && event.keyCode <= 105)) {
if(event.shiftKey) {
// 按下了shift组合键
event.returnValue = false;
if (window.event.preventDefault) {
window.event.preventDefault();
}
}
// 考虑小键盘上的数字键
} else if (event.keyCode >= 65 && event.keyCode <= 90) {
// 考虑大小写字母键
} else if (event.keyCode == 8) {
// backspace键
} else if (event.keyCode == 46) {
// delete键
} else if (event.keyCode == 37) {
// 左方向键
} else if (event.keyCode == 39) {
// 右方向键
} else if (event.keyCode == 32) {
// 空格
} else {
event.returnValue = false;
if (window.event.preventDefault) {
window.event.preventDefault();
}
}
}