javascript隱藏右鍵的方法:1、打開相應(yīng)的代碼文件;2、使用“window.oncontextmenu=function(e){e.preventDefault();}”方法禁用鼠標(biāo)右鍵菜單即可。
本文操作環(huán)境:Windows7系統(tǒng)、javascript1.8.5、Dell G3電腦。
javascript怎么隱藏右鍵?
js設(shè)置或禁用鼠標(biāo)右鍵菜單
當(dāng)用戶點(diǎn)擊鼠標(biāo)右鍵的時(shí)候
oncontextmenu
事件被觸發(fā)
js禁用鼠標(biāo)右鍵菜單
window.oncontextmenu=function(e){ //取消默認(rèn)的瀏覽器自帶右鍵 很重要??! e.preventDefault(); }
js自定義鼠標(biāo)右鍵菜單
html準(zhǔn)備自定義菜單項(xiàng)
<div id="menu"> <div class="menu">功能1</div> <div class="menu">功能2</div> <div class="menu">功能3</div> <div class="menu">功能4</div> <div class="menu">功能5</div></div>
css設(shè)置菜單項(xiàng)樣式
#menu{ width: 0; /*設(shè)置為0 隱藏自定義菜單*/ height: 125px; overflow: hidden; /*隱藏溢出的元素*/ box-shadow: 0 1px 1px #888,1px 0 1px #ccc; position: absolute; /*自定義菜單相對(duì)與body元素進(jìn)行定位*/ } .menu{ width: 130px; height: 25px; line-height: 25px; padding: 0 10px; }
js控制菜單的顯示與隱藏
window.oncontextmenu=function(e){ //取消默認(rèn)的瀏覽器自帶右鍵 很重要?。? e.preventDefault(); //獲取我們自定義的右鍵菜單 var menu=document.querySelector("#menu"); //根據(jù)事件對(duì)象中鼠標(biāo)點(diǎn)擊的位置,進(jìn)行定位 menu.style.left=e.clientX+'px'; menu.style.top=e.clientY+'px'; //改變自定義菜單的寬,讓它顯示出來 menu.style.width='100px'; menu.style.height='auto'; } //鼠標(biāo)左鍵任意位置單擊, 關(guān)閉右鍵菜單 window.onclick=function(e){ //用戶觸發(fā)click事件就可以關(guān)閉了,因?yàn)榻壎ㄔ趙indow上,按事件冒泡處理,不會(huì)影響菜單的功能 document.querySelector('#menu').style.height=0; }
推薦學(xué)習(xí):《js基礎(chǔ)教程》