现在位置: 首页 / 网站搭建 / 正文

网站美化 – 复制提醒和禁用F12以及右键菜单提醒代码美化版

效果展示

网站美化 – 复制提醒和禁用 F12 以及右键菜单提醒代码美化版

<!-- 引入 VUE -->

<script src="https://unpkg.com/vue@2.6.14/dist/vue.min.js"></script>

<!-- 引入样式 -->

<script src="https://unpkg.com/element-ui@2.15.6/lib/index.js"></script>

<!-- 引入组件库 -->

<link rel="stylesheet" href="https://unpkg.com/element-ui@2.15.6/packages/theme-chalk/lib/index.css">

建议放在头部文件。

代码

复制提醒 (在任意引用全局 JS 的文件内添加)

/* 复制提醒 */

document.addEventListener("copy",function(e){

new Vue({data:function(){

this.$notify({

title:"嘿！复制成功",

message:"若要转载请务必保留原文链接！爱你呦~",

position: 'bottom-right',

offset: 50,

showClose: false,

type:"success"

});

return{visible:false}

}

})

})

禁止使用右键和提醒 (在任意引用全局 JS 的文件内添加)

 /* 禁用右键菜单并提醒 */
document.oncontextmenu = function () {
new Vue({data:function(){
this.$notify({
title:"嘿！没有右键菜单",
message:"复制请用键盘快捷键",
position: 'bottom-right',
offset: 50,
showClose: false,
type:"warning"
});
return{visible:false}
}
})
return false;
}

禁止使用 f12 并且提醒 (在任意引用全局 JS 的文件内添加)

/* 禁用 F12 按键并提醒 */
document.onkeydown = function () {if (window.event && window.event.keyCode == 123) {
event.keyCode = 0;
event.returnValue = false;
new Vue({data:function(){
this.$notify({
title:"嘿！别瞎按",
message:"坏孩子！",
position: 'bottom-right',
offset: 50,
showClose: false,
type:"error"
});
return{visible:false}
}
})
return false;
}
};