js 基础之屏蔽右键

最新推荐文章于 2023-06-26 08:19:16 发布

爱生活，爱编程

最新推荐文章于 2023-06-26 08:19:16 发布

阅读量560

点赞数

分类专栏： javascript基础笔记

本文链接：https://blog.csdn.net/qq_15009739/article/details/103697954

版权

本文介绍了如何使用JavaScript来屏蔽网页的右键菜单，并实现自定义的右键弹出对话框。通过监听window.oncontextmenu事件并阻止默认行为来实现屏蔽，接着创建一个定位的弹出框，并在鼠标点击其他区域时隐藏。当页面有滚动条时，通过计算clientX和可视区距离来确保弹出框始终可见。文章提供了完整的实现代码。

摘要由CSDN通过智能技术生成

互联网有个好处，就是coｐｙ　，为了防止别人copy 你的网页数据，于是呼，有了，屏蔽右键的操作

屏蔽右键很简单！

只需要在window.oncontextmenu 的回调函数中，取消默认行为就行了，毕竟，弹出右键不是我们写代码实现的，是它默认的行为

好，到此你就学会了，屏蔽右键操作，

好，我们继续提需求，我们想弹出自己的对画框！

1，首先我们自己写个对话框，然后用定位的形式！因为后期我们要让他随着我们鼠标右键，点哪就在哪弹出

页面有点丑，大家将就看吧

css

 <style>

        *{
            padding:0;
            margin:0;
        }

        body {
            height: 2000px;
        }
        #menu {
            position: absolute;
            left: 100px;
            top:100px;
            list-style: none;
            width:280px;
            border:1px solid cadetblue;
            display:none;
        }
        #menu li {
            height: 30px;
            line-height: 30px;
            padding-left: 5px;
            background-color: #ccc;
            c