原生JS 绑定右键菜单 并隐藏浏览器右键菜单

废话不多说,上教程。🤩


原生JS 绑定右键菜单 并隐藏浏览器右键菜单

 //获取元素
 var dom = document.getElementById("box");
 dom.addEventListener('contextmenu', function(e) {
   if (e.button === 2){
      notesTitle=e.srcElement.innerText // 获取点击的元素
      e.preventDefault();// 取消浏览器右键菜单
      // 跟随鼠标
      var x = e.clientX;
      var y = e.clientY;
      var menu = document.querySelector('#note_list_menu');
      menu.style.left = x + 'px';
      menu.style.top = y + 'px';
      menu.style.display = 'block';
      // 鼠标点击其他位置时隐藏菜单
      document.onclick = function(){
         menu.style.display = 'none';
      }
    }
   });

到这里就🎉🎉🎉大功告成了!🎉🎉🎉 你学废了吗😀
posted @ 2024-04-22 16:21  浅·笑  阅读(117)  评论(0编辑  收藏  举报