js怎么编写鼠标的右击事件

JavaScript024

js怎么编写鼠标的右击事件,第1张

js右击事件

先贴代码:

注意的两个点是:

①:先取消默认右击事件,event.preventDefault()

②:判断event.Button:0:左键,1:滚轮,2:右键。

值得一说的的是"oncontextmenu"是指右键按下时的作用。

再给一个应用吧:

右击div显示出自己定义的菜单,点击除了div的地方,是默认的右击事件。

代码:

效果自行查看吧,其实也没啥。

原理是,右键的菜单其实是一个隐藏的div,当点击父类div的时候,它出现而已。(貌似这样一说显得这个程序好垃圾啊,_(___)_其实这也是大厦的一块砖,少了它,大厦会塌的)

再给了类似的应用吧,一个点击div消失的效果。

DOM3级事件中定义了9个鼠标事件。 mousedown:鼠标按钮被按下(左键或者右键)时触发。不能通过键盘触发。 mouseup:鼠标按钮被释放弹起时触发。不能通过键盘触发。 click:单击鼠标 左键 或者按下回车键时触发。这点对确保易访问性很重要,意味着onclick事件处理程序既可以通过键盘也可以通过鼠标执行。 dblclick:双击鼠标 左键 时触发。 mouseover:鼠标移入目标元素上方。鼠标移到其后代元素上时会触发。 mouseout:鼠标移出目标元素上方。 mouseenter:鼠标移入元素范围内触发, 该事件不冒泡 ,即鼠标移到其后代元素上时不会触发。 mouseleave:鼠标移出元素范围时触发, 该事件不冒泡 ,即鼠标移到其后代元素时不会触发。 mousemove:鼠标在元素内部移到时不断触发。不能通过键盘触发。 document.oncontextmenu =function(){return false} document.body.onmouseup =function(e){ if(e.button===2){ console.log("右键")     that.rightHand =true   }else if(e.button===1) { console.log("中间键") }else { console.log("左键") } }