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 ...
随机推荐
- ZOJ Problem Set - 3822Domination(DP)
ZOJ Problem Set - 3822Domination(DP) problemCode=3822">题目链接 题目大意: 给你一个n * m的棋盘,每天都在棋盘上面放一颗棋子 ...
- J2EE之13个规范标准概念
主要是关于j2EE十三个规范的总结. java基础知识 首先java分为三类:J2ME.J2SE.J2EE. 依据开发软件的大小和量级他们的作用分别不同,J2ME是开发为机顶盒.移动电话和PDA之类嵌 ...
- js---07 js预解析，作用域---闭包
js解析器首先不会逐行读代码,这是第二部了. 首先 根据var找到变量,根据function找函数,找到变量var a = 1,js解析器只会读取等号前面的var a,并把a设置值未定义,并不会读取等 ...
- js02---字符串
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...
- android图像处理(3) 浮雕效果
这篇将讲到图片特效处理的浮雕效果.跟前面一样是对像素点进行处理,算法是通用的. 算法原理:用前一个像素点的RGB值分别减去当前像素点的RGB值并加上127作为当前像素点的RGB值. 例: ABC 求B ...
- android图像处理系列之三－－ 图片色调饱和度、色相、亮度处理
原图: 处理后: 下面贴代码: 一.图片处理层: package com.jacp.tone.view; import java.util.ArrayList; import android.cont ...
- 基于Linux平台Softimage XSI 演示
2009年底上映的<阿凡达>是电影特效的巅峰之作,就在本月初上映的变形金刚3每次观看之后看得眼花缭乱总能让我热血沸腾,要是自己能做出那样的特效该多好,Linux下研究Maya已经有一段日 ...
- Oracle 11g win7 64位【桌面类 && 服务器类】安装过程
Oracle 11g win7 64位[桌面类 && 服务器类]安装过程 一.首先,根据自己的操作系统位数(32位或64位),到官网下载相应的安装程序,如下图所示. ...
- Vue 实现分页+输入框关键字筛选
分页的实现(Vue+Element)+输入框关键字筛选 1.这里用的是Element 自带的分页组件 <template> <div class="sales-table& ...
- hdu 1003 Max Sum 最大字段和 dp
今天看了一上午dp.看不太懂啊.dp确实不简单.今天開始学习dp,搜了杭电的dp46道,慢慢来吧.白书上的写的 又不太具体,先写几道题目再说. .. 题目连接:id=516&page=1&qu ...