問題描述:瀏覽器非input、textarea編輯狀態,按backspace會直接返回上一頁
解決方法:
-在util文件夾添加preventBackspace.js文件
代碼如下:
export const banBackSpace = (e) => {
let ev = e || window.event;
// 各種瀏覽器下獲取事件對象
let obj = ev.relatedTarget || ev.srcElement || ev.target || ev.currentTarget;
// 按下Backspace鍵
if (ev.keyCode === 8) {
// 標簽名稱
let tagName = obj.nodeName;
// 如果標簽不是input或者textarea則阻止Backspace
if (tagName !== 'input' && tagName !== 'textarea') {
return stopIt(ev);
}
let tagType = obj.type.toUpperCase(); // 標簽類型
// input標簽除了下面幾種類型,全部阻止Backspace
if (tagName === 'input' && (tagType !== 'text' && tagType !== 'textarea' && tagType !== 'password')) {
return stopIt(ev);
}
// input或者textarea輸入框如果不可編輯則阻止Backspace
if ((tagName === 'input' || tagName === 'textarea') && (obj.readOnly === true || obj.disabled === true)) {
return stopIt(ev);
}
}
}
function stopIt (ev) {
if (ev.preventDefault) {
// preventDefault()方法阻止元素發生默認的行為
ev.preventDefault();
}
if (ev.returnValue) {
// IE瀏覽器下用window.event.returnValue = false;實現阻止元素發生默認的行為
}
return false;
}
-在views/main/index.vue文件,引用preventBackspace里的方法
-至此,問題解決