利用element显示Notification通知,复制提醒,禁用F12或右键菜单提醒


------正文内容展示,开始汲取新知识啦------

前言

这个弹窗挺好看的,就共享给大家了,废话不多说!

20220121172336711-1024x904

cdn资源

<!-- 引入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的文件内添加:

禁用右键菜单并提醒

在任意引用全局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;
}
};

相关扩展

禁用左键选择

//禁用左键选择
      document.onselectstart = function () {
        return false;
      }

禁用复制

//禁用复制
      document.oncopy = function () {
        return false;
     }

禁用Ctrl+Shift+I

//禁用Ctrl+Shift+I
        if ((event.ctrlKey) && (event.shiftKey) && (event.keyCode == 73)) {
          return false;
        }

 

温馨提示:本文最后更新于2023-12-19 14:19:08,某些文章具有时效性,若有错误或已失效,请私信客服或联系知新社长
------本文内容已结束,喜欢请分享------

感谢您的访问,Ctrl+D收藏本站吧。

© 版权声明
二月 3

知岛上的今时往日

THE END
点赞0投币 分享
评论 共28条
头像
善语结善缘,恶言伤人心。(禁止发送无意义的字符)
提交
头像

昵称

夸夸Ta
夸夸
还有吗!没看够!
取消
昵称表情代码图片
    • 头像 anyue0
    • 头像 anyue0
    • 头像 11110
社区求救信号帮助是一种美德