javascript右键,js自定义鼠标右键菜单

js如何实现右键菜单

思路:

成都创新互联公司,专注为中小企业提供官网建设、营销型网站制作、响应式网站设计、展示型成都网站建设、做网站等服务,帮助中小企业通过网站体现价值、有效益。帮助企业快速建站、解决网站建设与网站营销推广问题。

你需要先组织默认的右键事件,

你需要自己制作一个右键图层,

下面是简单的代码:

style

* {margin:0; padding:0; list-style:none;}

#ul1 li {width:400px; background:#CCC; border:1px solid black; margin:10px; float:left; line-height:30px; text-indent:1em;}

#menu {width:150px; border:1px solid black; border:1px solid black; position:absolute; left:0; top:0; display:none; background:white;}

#menu li {padding:3px;}

#menu li:hover {background:#CCC;}

/style

script

window.onload=function (){

var aLi=document.getElementById('ul1').children;

var oMenu=document.getElementById('menu');

var aMenuLi=oMenu.children;

for (var i=0; iaLi.length; i++)

{

aLi[i].oncontextmenu=function (ev){

var oEvent=ev || event;

oMenu.style.display='block';

oMenu.style.left=oEvent.clientX+'px';

oMenu.style.top=oEvent.clientY+'px';

var _this=this;

aMenuLi[0].onclick=function (){

_this.parentNode.removeChild(_this);

};

return false;

};

}

document.onclick=function (){

oMenu.style.display='none';

};

};

/script

/head

body

ul id="menu"

li删除/li

li变成红色/li

li变成绿色/li

li变成黄色/li

li变成蓝色/li

/ul

ul id="ul1"

li中国信保原副总戴春宁贪污、受贿、通奸被开除党籍/li

li中纪委原书记贺国强考察贵阳孔学堂(图)/li

li解放军报官微:胡锡进相关微博内容是胡说八道/li

li刘汉向湖北省高院提出上诉 已提交上诉状/li

li澳洲公布疑似马航坠毁噪音 或解MH370失踪之谜/li

li曝京沪高铁上海段地面开裂10cm 回应称不影响运营/li

li朝鲜宣传一农场已建成“社会主义世外桃源”(图)/li

/ul

/body

js右键事件

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("左键")

}

}

js模拟点击鼠标右键

前提是该元素已绑定事件

如果没有事件,右键是系统默认的右键菜单

因此,先给元素绑定个右键事件:

再来模拟右键菜单

如果要实现系统级的右键菜单,只能借助其他方法,比如使用pywin32的

python实现鼠标右键


网站栏目:javascript右键,js自定义鼠标右键菜单
标题URL:http://hbruida.cn/article/dsgcipp.html