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 ...
随机推荐
- PyCharm激活方法
1.激活码激活 1.修改hosts文件 将0.0.0.0 account.jetbrains.com添加到hosts文件最后,windows系统hosts文件路径为:C:\windows\system ...
- Linux发行版centos, ubuntu等
公司装的是centos,centos其实就是无支持版的redhat. redhat是一个服务器的操作系统它的稳定性是比较高的,同时提供在线管理服务,服务器故障预警等,当然前提是要购买昂贵的服务. Su ...
- Android自己定义效果——随机抽奖
那天逛android开源码的时候,看到一个wheel menu的自己定义效果,就是类似人家的那种转盘抽奖,把人家project看了下.认为非常好玩.可是不想在他上面改,于是就自己想了一个类似的随即抽奖 ...
- 62.C++文件操作list实现内存检索,实现两千万数据秒查
1 #include <iostream> #include <fstream> #include <cstdlib> #include <string> ...
- 61.C++文件操作实现硬盘检索
#include <iostream> #include <fstream> #include <memory> #include <cstdlib> ...
- DbSet<>.Find()
第一篇为大家带来新的API,DbSet<>.Find(). 过去我们常常用Where或First(FirstOrDefault)方法来查找对应的实体,比如: var people = fr ...
- kali之Nmap (Network Mapper(网络映射器)
Nmap是主机扫描工具,他的图形化界面是Zenmap,分布式框架为Dnamp. Nmap可以完成以下任务: 主机探测 端口扫描 版本检测 系统检测 支持探测脚本的编写 Nmap在实际中应用场合如下: ...
- 重构insert update 比较两个datatbale
#region 下载时重构insert(数据带null处理) public void DownDataInsert(DataTable _dt, string TableName,DBHelper d ...
- 怎样使用 OneAPM 监控微软 Azure Cloud Service ?
不知不觉微软 Azure 已经进入中国市场近两年的时间.那么 Azure 平台的性能到底怎样?资源载入的延迟.虚拟机的稳定性等问题是否切实满足客户期许.这些都是大家对微软 Azure 这个国外的云服务 ...
- stm32与arm7比较(经典)
http://wenku.baidu.com/link?url=LIVcT1AQL0IgVF1xan5Zy9rXarCBo66hj7OXSxM1ap7FpssO4c3sd1pZd8azfBPr3PBy ...