Javascript和jquery事件--鼠标右键事件，contextmenu
右键点击触发是浏览器的默认菜单事件contextmenu，你可以选择阻止它，使用event.preventDefault();或者return false;。
想要定义右键点击事件，关注的是mouseup或者mousedown事件，使用event获取点击的键：
Js中使用event. button---0,1,2分别是左键、滚轮、右键
Jq中使用event.which---1,2,3分别是左键、滚轮、右键
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8"/>
<title>鼠标事件</title>
<script src='/static/Lib/jquery/jquery-3.3.1.min.js'></script>
<script src='js/jquery-3.3.1.min.js'></script>
<style>
#f1{
padding:10px;
background:black;
}
#f2{
padding:10px;
background:red;
}
#f3{
padding:10px;
}
#test{
background:black;
color:white;
padding:2px;
}
</style>
</head>
<body>
<div id="f1">
<button id="button1">javascript</button>
</div>
<div id="f2">
<button id="button2">jquery</button>
</div>
<div id='f3'><a href="worker.js" target="_blank" id='test'><span></span>超链接</a></div>
<script type="text/javascript">
function say(){
alert(this.innerHTML);
}
window.onload= function(){
//实现右键单击事件
//js
//关闭鼠标右键默认事件
document.getElementById("button1").oncontextmenu = function(e){
e.preventDefault();
};
//设置鼠标按键事件
document.getElementById("button1").onmousedown = function(e){
if(e.button ==2){
console.log("你点了右键");
}else if(e.button ==0){
console.log("你点了左键");
}else if(e.button ==1){
console.log("你点了滚轮");
}
}
//jq
//关闭鼠标右键默认事件
$('#button2').bind("contextmenu", function(){
return false;
});
//设置鼠标按键事件
$('#button2').on('mousedown', function(e){
if (1 == e.which) {
console.log("你点了左键");
} else if (2 == e.which) {
console.log("你点了滚轮");
} else if (3 == e.which) {
console.log("你点了右键");
}
}); }; </script>
</body>
</html>
示例html和js代码
https://www.cnblogs.com/chenluomenggongzi/p/5777545.html
https://blog.csdn.net/u014291497/article/details/52267604
Javascript和jquery事件--鼠标右键事件，contextmenu的更多相关文章
- Unity 添加鼠标右键事件
把此类放到 Editor下使用就OK using UnityEngine; using System.Collections; using System.Collections.Generic; us ...
- ExtJS配置TabPanel的鼠标右键菜单(ContextMenu)功能
更新记录 2022年6月14日 发布. 2022年6月13日 初稿. TabPanel的鼠标右键菜单(ContextMenu)功能介绍 开源的TabPanel组件很少做到拖拽调整tab顺序功能的,支持 ...
- javascript 处理鼠标右键事件
使用右键事件 在需要右键的地方加上 onmousedown="if(event.button == 2) alert('点击右键了!');即可 不经意地被一位同事问起在javascri ...
- jquery鼠标右键事件
$('body').live("mousedown",function(e){ $('body').bind("contextmenu",function(e) ...
- jquery 鼠标右键事件、左键单击事件判定
$(function(){ $('a').mousedown(function(e){ alert(e.which) // 1 = 鼠标左键 left; 2 = 鼠标中键; 3 = 鼠标右键 retu ...
- JavaScript与jQuery关于鼠标点击事件
即实现鼠标点击其中一个菜单发生样式的改变,当点击下一个菜单时,当前菜单样式改变,其他菜单均变为之前样式. 用JavaScript,jQuery都可以实现,只是后者是封装的JavaScript库,具有s ...
- 【javascript】jQuery判断用户右击事件
jquery 判断用户是鼠标是右击还是左击, // 1 = 鼠标左键 left; 2 = 鼠标中键; 3 = 鼠标右键 $(document).mousedown(function(e) { if(3 ...
- html js 捕捉鼠标右键事件，按下滚轮事件，左键点击事件
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- AngularJS实现鼠标右键事件
常规javascript鼠标右键直接在标签上加contextmenu="alert('a')"即可,现在angular通过directive来定义一个右键指令. app.direc ...
随机推荐
- Java Web学习总结（21）——http协议响应状态码大全以及常用状态码
http协议响应状态码大全以及常用状态码 当我们在浏览网页或是在查看服务器日志时,常会遇到3位数字的状态码,这3位数字是什么意思呢?其实,这3位数字是HTTP状态码,用来表示网页服务器HTTP响应状态 ...
- Html学习总结（1）——理解Html的head
HTML文档的head部分,通常包括指定页面标题,为搜索引擎提供关于页面本身的信息,加载样式表,以及加载JavaScript文件(出于性能考虑,多数时候放在页面底部</body>标签结束前 ...
- visualvm监控tomcat
https://my.oschina.net/weidedong/blog/787203
- 使用Spring Mvc 转发 带着模板 父页面 之解决方法 decorators.xml
周末了,周一布置的任务还没完毕,卡在了页面跳转上,接手了一个半截的项目要进行开发,之前没有人给培训.全靠自己爬代码,所以进度比較慢.并且加上之前没实用过 Spring Mvc 开发项目.所以有点吃力, ...
- Android插件化（二）：使用DexClassLoader动态载入assets中的apk
Android插件化(二):使用DexClassLoader动态载入assets中的apk 简单介绍 上一篇博客讲到.我们能够使用MultiDex.java载入离线的apk文件.须要注意的是,apk中 ...
- js---13 this call apply
//this:this可以写在js全剧环境中(全局环境中this是window对象),this可以写在函数中,可以写在对象中, function f(){ this.name = "asdf ...
- python Tricks —— list 镜像复制与 list comprehension 列表解析的顺序
0. 对 list 镜像复制,a = [1, 2, 3] ⇒ [1, 2, 3, 3, 2, 1] a*2 ⇒ a = [1, 2, 3, 1, 2, 3] a.extend(reversed(a)) ...
- 分享一个表格插入和删除编辑功能用jQuery实现
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- tcp为什么要三次握手
作者:大闲人柴毛毛链接:https://www.zhihu.com/question/24853633/answer/254224088来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转 ...
- POJ 2079 Triangle 旋转卡壳求最大三角形
求点集中面积最大的三角形...显然这个三角形在凸包上... 但是旋转卡壳一般都是一个点卡另一个点...这种要求三角形的情况就要枚举底边的两个点 卡另一个点了... 随着底边点的递增, 最大点显然是在以 ...