Ext JS框架程序中阻止键盘触发回退或者刷新页面
编程学习 2021-07-04 19:59www.dzhlxh.cn编程入门
键盘上的F5或者退格键等按键一般来说会触发页面的后退或者刷新事件,然而这些在前端用代码是可以给屏蔽掉的,这里我们就来看一下Ext JS框架程序中阻止键盘触发回退或者刷新页面的代码分享
在 Extjs 开发中,我们需要屏蔽一些键盘按键,来避免用户在使用键盘操作的过程中不小心按到这些快捷键造成输入信息丢失等问题.
Ext.onReady(function(){
Ext.WindowMgr.zseed = 10000;
Ext.QuickTips.init();
Ext.getDoc().on("contextmenu", function(e){
e.stopEvent();
});
if(document.addEventListener){
document.addEventListener("keydown",maskBackspace, true);
}else{
document.attachEvent("onkeydown",maskBackspace);
}
function maskBackspace(event){
var event = event || window.event; //标准化事件对象
var obj = event.target || event.srcElement;
var keyCode = event.keyCode ? event.keyCode : event.which ?
event.which : event.charCode;
if(keyCode == 8){
if(obj!=null && obj.tagName!=null && (obj.tagName.toLowerCase() == "input"
|| obj.tagName.toLowerCase() == "textarea")){
event.returnValue = true ;
if(Ext.getCmp(obj.id)){
if(Ext.getCmp(obj.id).readOnly) {
if(window.event)
event.returnValue = false ; //or event.keyCode=0
else
event.preventDefault(); //for ff
}
}
}else{
if(window.event)
event.returnValue = false ; // or event.keyCode=0
else
event.preventDefault(); //for ff
}
}
}
var map = new Ext.KeyMap(document, [
{
key: [116], // F5
fn: function(){ },
stopEvent: true,
scope: this
},{
key: [37,39,115], //方向键左,右,F4
alt: true,
fn: function(){ },
stopEvent: true,
scope: this
}, {
key: [82], // ctrl + R
ctrl: true,
fn: function(){ },
stopEvent: true,
scope: this
}]);
map.enable();
});
禁止在IE8中使用 F5 刷新还需加上代码 ：
<body onkeydown="if(event.keyCode==116){event.keyCode=0;return false;}">