oncontextmenu事件
oncontextmenu的作用是阻止浏览器默认的鼠标右键行为。
阻止弹出右键自带菜单
document.oncontextmenu=function(){
console.log('你点击了右键');
return false;
}
模拟右键菜单
<style>
*{
margin: 0;
padding:0;
list-style: none;
}
#main{
width: 140px;
height: auto;
background: #ededed;
text-align: center;
display: none;
position: absolute;
}
</style>
<div id="main">
<ul>
<li>我是第一个选项</li>
<li>我是第二个选项</li>
<li>我是第三个选项</li>
<li>我是第四个选项</li>
</ul>
</div>
<script>
document.oncontextmenu=function(ev){
var oEvent = ev||event;
var Odiv = document.getElementById('main');
Odiv.style.display='block';
Odiv.style.left=oEvent.clientX+'px';
Odiv.style.top=oEvent.clientY+'px';
return false
};
var Odiv = document.getElementById('main');
document.onclick=function(){
Odiv.style.display='none';
} </script>
oncontextmenu事件的更多相关文章
- OnContextMenu事件(转)
用oncontextmenu事件单禁用右键菜单 一个页面中,BODY中用oncontextmenu='return false'来取消鼠标右键:在JS中设置oncontextmenu='return ...
- 熟悉一下oncontextmenu事件的知识
定义和使用 只要点击鼠标右键,就触发oncontextmenu事件并打开上下文菜单. 需要注意的是:所有主流浏览器都支持oncontextmenu事件,但其中的contextmenu元素只有FireB ...
- oncontextmenu
一个页面中,BODY中用oncontextmenu='return false'来取消鼠标右键:在JS中设置oncontextmenu='return true'用window.document.on ...
- 第一百二十一节,JavaScript事件绑定及深入
JavaScript事件绑定及深入 学习要点: 1.传统事件绑定的问题 2.W3C事件处理函数 3.IE事件处理函数 4.事件对象的其他补充 事件绑定分为两种:一种是传统事件绑定(内联模型,脚本模型) ...
- OnContextMenu实现禁止鼠标右键
OnContextMenu事件 定义和使用:oncontextmenu 事件在元素中用户右击鼠标时触发并打开上下文菜单.注意:所有浏览器都支持 oncontextmenu 事件, contextmen ...
- 浏览器根对象window之事件
1. [事件]动画 onanimationstart onanimationend onanimationiteration onwebkitanimationend onwebkitanimatio ...
- Js中的4个事件
除了加载文档的事件onload和鼠标相关的一些事件如onclick,onmouseover等.js还有一些相对不常用的事件,这些事件也有各自的应用场景,本文就介绍 onkeydown,oncontex ...
- javascript基础07
javascript基础07 1.节点 元素.childNodes : 属性 只读 属性 子节点列表集合 元素.childNodes 只包含子节点,不包含孙节点 DOM节点的类型有很多种,w3c标准有 ...
- 《HTML5秘籍》学习总结--2016年7月24日
前段时间因为工作中看到同事使用了一个type为date的<input>元素,直接就形成了一个日期选择的表单控件,当时觉得很神奇,以为是什么插件,就问了同事是怎么做出来的,同事告诉我这是HT ...
随机推荐
- Servlet生命周期引起的问题
A:Servlet的定义与作用. B:Serlvet的体系结构 Servlet | | GenericServlet | | HttpServlet | | 用户自定义的Servlet. HttpSe ...
- CSS基础1
CSS是层叠样式表(Cascading Style Sheets)的缩写,它有以下优点:①提高页面浏览速度:②缩短改版时间,降低维护费用:③更好的控制页面布局:④实现表现和结构.内容相分离:⑤更方便搜 ...
- 基于ssh框架开发的购物系统的质量属性
根据前面的博客,我们已经大致了解了ssh架构开发整体概念:Struts是一个实现了MVC模式的经典的框架:Hibernate是轻量级Java EE应用的持久层解决方案,以面向对象的方式提供了持久化类到 ...
- 异或密码---hdu5968(CCPC合肥,二分)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5968 思路:先把所有的连续异或值保存起来,排序,然后用二分找到距离x最近的那个点,判断即可: # ...
- web前端开发和后端开发有什么区别?
web前端分为网页设计师.网页美工.web前端开发工程师 首先网页设计师是对网页的架构.色彩以及网站的整体页面代码负责 网页美工只针对UI这块儿的东西,比如网站是否做的漂亮 web前端开发工程师是负责 ...
- tomcat,zookeeper,activeMQ,Kafka设置jvm参数
1,tomcat设置jvm参数 设置方法: 在tomcat bin 目录增加配置:setenv.sh #add tomcat pid CATALINA_PID="$CATALINA_ ...
- 关于 update别名 与update select
正确写法: update 别名 set 别名点字段 =xxxx UPDATE a SET a.StandardID = (SELECT b.StandardID FROM SurgeryMappi ...
- composer [ReflectionException] Class Fxp\Composer\AssetPlugin\Repository\NpmRepository does not exist
在执行composer update时报错 [ReflectionException]Class Fxp\Composer\AssetPlugin\Repository\NpmRepository d ...
- chrome调试 JavaScript 脚本
随着 JavaScript 应用的复杂性逐渐提高,开发者需要有力的调试工具来帮助他们快速发现问题的原因,并且能高效地修复它.Chrome DevTools 提供了一系列实用的工具使得调试 JavaSc ...
- C++动态加载DLL调用方法
一.构建DLL路径 char szTmp[_MAX_PATH]; char* szPath = getcwd(szTmp, _MAX_PATH);//获取当前工作目录 //构建dll路径 strc ...