禁止鼠标加滚动放大缩小,及ctrl+ ,ctrl-,ctrl0对页面进行放大缩小操作,代码如下
封装在js中的方法如下,
const disableScale = function() {
function mousewheel(e){
e = e || window.event;
if ((e.wheelDelta && event.ctrlKey) || e.detail) {
event.preventDefault();
}
}
function keydown(event){
if (
(event.ctrlKey === true || event.metaKey === true) &&
(event.keyCode === 61 ||
event.keyCode === 107 ||
event.keyCode === 173 ||
event.keyCode === 109 ||
event.keyCode === 187 ||
event.keyCode === 189 ||
event.keyCode === 48)
) {
event.preventDefault();
}
}
const addListener = function() {
document.addEventListener(
"mousewheel",
mousewheel,
{
capture: false,
passive: false,
}
);
document.addEventListener(
"keydown",
keydown,
false
);
};
const removeListener = function() {
document.removeEventListener('mousewheel', mousewheel,false);
document.removeEventListener('keydown', keydown, false);
};
return {
addListener,
removeListener,
}
}();
export{
disableScale
}
vue页面禁止放大缩小的页面
import { disableScale } from "@/assets/js/xxx.js";
mounted(){
disableScale.addListener();
},
beforeDestroy(){
disableScale.removeListener();
}
完成