在Bootstrap下用JavaScript自定义右键菜单

最新推荐文章于 2024-08-04 18:27:10 发布

瑞凤玉子烧

最新推荐文章于 2024-08-04 18:27:10 发布

阅读量2.8k

点赞数

分类专栏： Web前端开发笔记

本文链接：https://blog.csdn.net/u012440550/article/details/41909441

版权

这篇博客介绍了如何在Bootstrap环境下利用JavaScript实现自定义的右键菜单，通过阻止浏览器默认的右键菜单，结合showmenu函数来展示个性化的菜单选项。

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

其实不用Bootstrap也行的，纯属为了好看……

首先要在需要弹出右键菜单的地方屏蔽掉浏览器默认的右键菜单：

<div id="rightmenuparentdiv" οncοntextmenu="showmenu();return false;">
    <div id="rightmenudiv">
        123
    </div>
</div>

然后写showmenu这个函数：

function showmenu(){
            document.getElementById("tree").onmousedown = function(e){
                if(e.which == 3){
                    if (!e) {
                        e = window.event;
                    }else {
                        e.srcElement = e.target;
                    }
                    if(e.srcElement.innerHTML != ""){
                        document.getElementById("rightmenu").style.left = e.clientX + "px";
                        document.getElementById("rightme