javascript右键菜单设置

最新推荐文章于 2024-08-05 22:35:36 发布

cdcdhj

最新推荐文章于 2024-08-05 22:35:36 发布

阅读量319

点赞数

分类专栏： javascript学习日记文章标签： JavaScript 右键菜单事件监听用户交互页面离开提示

本文链接：https://blog.csdn.net/cdcdhj/article/details/117417157

版权

javascript学习日记专栏收录该内容

142 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script language="javascript" src="shijian.js"></script>
	</head>
	<body>
		<div id="mydiv">tight click or Ctrl+click me to get a custom content menu.
		Click anywhere else to get the default context menu.
		</div>
		<ul id="myMenu" style="position:absolute;visibility:hidden;background-color: silver;">
			<li><a href="http://www.xxx.cn">新官网</a></li>
			<li><a href="http://www.xxxx.com">老官网</a></li>
			<li><a href="http://www.xxxxx.com">王之王</a></li>
		</ul>
		<script language="javascript">
		 window.onload=function(event){
			 var div=document.getElementById('mydiv');
			 div.addEventListener('contextmenu',function(event){
				 event=event||window.event;
				 event.preventDefault();    //取消默认
				 var menu=document.getElementById('myMenu');
				 menu.style.left=event.pageX+"px";
				 menu.style.top=event.pageY+"px";
				 menu.style.visibility="visible";
			 });
			 document.addEventListener('click',function(event){
				 document.getElementById('myMenu').style.visibility="hidden";
			 });
		 };
		 window.onbeforeunload=function(event){
			 event=event||window.event;
			 var m="你将离开此页";
			 event.returnValue=m;
			 event.preventDefault(m);
			 return m;
		 };
		</script>
		
	</body>
</html>