zoukankan      html  css  js  c++  java
  • 阻止默认时间

    demo:

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> .box{200px;height: 300px;background: #ccc;position: absolute;left:0;top:0;display: none} .box ul{margin: 0} </style> </head> <body> <!-- <a href="http://www.baidu.com">21321312</a> --> <div class="box"> <ul> <li>选项1</li> <li>选项2</li> <li>选项3</li> <li>选项4</li> </ul> </div> </body> <script> var obox = document.querySelector(".box") document.oncontextmenu = function(eve){ //oncontextmenu 事件在元素中用户右击鼠标时触发并打开上下文菜单。 var e = eve || window.event; obox.style.display = "block"; // return false; // 取消默认事件 stopDefault(e); obox.style.left = e.offsetX + "px"; obox.style.top = e.offsetY + "px"; } document.onclick = function(){ obox.style.display = "none" } function stopDefault(e){ if(e.preventDefault){ e.preventDefault() //IE }else{ e.returnValue = false; //GOOGLE } } //封装函数 </script> </html>
  • 相关阅读:
    [css]继承关系(一)
    Trie树-提高海量数据的模糊查询性能
    [C]struct结构化数据的一些要点
    [C]表达式结合规律和运算符优先级
    [C]副作用和序列点
    [C]链接和生存周期
    [PHP]关于连接MySQL的问题
    IT网址大全
    VUE 生命周期
    Vue 组件间传值
  • 原文地址:https://www.cnblogs.com/hy96/p/11419643.html
Copyright © 2011-2022 走看看