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>
  • 相关阅读:
    QML vs WEB
    《TO C产品经理进阶》
    《TO B产品设计标准化》
    《多元思维模型》跨学科及其核心思维模型
    产品经理审美训练
    Aria2多线程轻量级批量下载利器
    正则表达式
    如何开发一个用户脚本系列教程
    Aria2自动下载
    助贷
  • 原文地址:https://www.cnblogs.com/hy96/p/11419643.html
Copyright © 2011-2022 走看看