Javascript實作滑鼠右鍵自訂特色選單
JS屏蔽鼠标右键的两种方法,比较常用的一个JS小功能,用上这个代码后,浏览者在访问你网页的时候就不能点击右键了,点了也不会弹出右键菜单,本功能最好不要用的太多哦,有时候用户会反感的。
代码如下:
<html> <head> <title>屏蔽鼠标右键</title> </head> <body oncontextmenu=self.event.returnvalue=false> 第一种方法:在body标签里加上oncontextmenu=self.event.returnvalue=false; <br> <script language="javascript"> <!-- function document.oncontextmenu() { return false; } function nocontextmenu() { if(document.all) { event.cancelBubble=true; event.returnvalue=false; return false; } } --> </script> 第二种方法:在body里加入onmousedown="rclick()" oncontextmenu= "nocontextmenu()" <br> <script language="javascript"> <!-- function rclick() { if(document.all) { if (event.button == 2){ event.returnvalue=false; } } } --> </script> <br>详细情况请查看代码。<br> <br>现在点击你的鼠标右键,不起作用了。 </body> </html>
以上就是本文的全部内容,希望对大家的学习有所帮助。
,两种JS实现屏蔽鼠标右键的方法,
"
在Web端,通常是不需要右键菜单,各个浏览器也有自己的右键菜单。但是对于一些特殊的网页,是需要右键菜单来增加用户体验的,比如百度音乐,QQ邮箱,相信大家都在Web端使用过右键菜单了,现在来分享一下如何实现,比较简单。
运行代码:
window.onload = function() { document.oncontextmenu = block; document.body.onmouseup = function(event) { if (!event) event = window.event; if (event.button == 2) { var x = event.pageX || event.clientX; var y = event.pageY || event.clientY; document.getElementById("contextMenu").style.left = x "px"; document.getElementById("contextMenu").style.top = y "px"; document.getElementById("contextMenu").style.display = "block"; } } //阻止事件冒泡 document.getElementById("contextMenu").onclick = function(event) { event.stopPropagation(); } //点击其他地方隐藏 document.onclick = function() { document.getElementById("contextMenu").style.display = "none"; } for (var i = 0; i < getElementsByClassName("contextMenuItem").length; i ) { getElementsByClassName("contextMenuItem")[i].onclick = function(event) { event = event ? event : window.event var target = event.srcElement ? event.srcElement : event.targe; document.getElementById("contextMenu").style.display = "none"; //alert("您点击了: " target.innerHTML); } } } function block(event) { if (window.event) { event = window.event; event.returnValue = false; } else event.preventDefault(); } //兼容IE不支持getElementsByClassName function getElementsByClassName(className, root, tagName) { if (root) { root = typeof root == "string" ? document.getElementById(root) : root; } else { root = document.body; } tagName = tagName || "*"; if (document.getElementsByClassName) { return root.getElementsByClassName(className); } else { var tag = root.getElementsByTagName(tagName); var tagAll = []; for (var i = 0; i < tag.length; i ) { for (var j = 0, n = tag[i].className.split(" "); j < n.length; j ) { if (n[j] == className) { tagAll.push(tag[i]); break; } } } return tagAll; } }
效果图:
以上是Javascript實作滑鼠右鍵自訂特色選單的詳細內容。更多資訊請關注PHP中文網其他相關文章!

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

Netflix上的頭像是你串流媒體身分的視覺化代表。使用者可以超越預設的頭像來展現自己的個性。繼續閱讀這篇文章,了解如何在Netflix應用程式中設定自訂個人資料圖片。如何在Netflix中快速設定自訂頭像在Netflix中,沒有內建功能來設定個人資料圖片。不過,您可以透過在瀏覽器上安裝Netflix擴充功能來實現此目的。首先,在瀏覽器上安裝Netflix擴充功能的自訂個人資料圖片。你可以在Chrome商店買到它。安裝擴充功能後,在瀏覽器上開啟Netflix並登入您的帳戶。導航至右上角的個人資料,然後點擊

人臉偵測辨識技術已經是一個比較成熟且應用廣泛的技術。而目前最廣泛的網路應用語言非JS莫屬,在Web前端實現人臉偵測辨識相比後端的人臉辨識有優勢也有弱勢。優點包括減少網路互動、即時識別,大大縮短了使用者等待時間,提高了使用者體驗;弱勢是:受到模型大小限制,其中準確率也有限。如何在web端使用js實現人臉偵測呢?為了實現Web端人臉識別,需要熟悉相關的程式語言和技術,如JavaScript、HTML、CSS、WebRTC等。同時也需要掌握相關的電腦視覺和人工智慧技術。值得注意的是,由於Web端的計

如何在Eclipse中自訂快捷鍵設定?身為開發人員,在使用Eclipse進行編碼時,熟練快捷鍵是提高效率的關鍵之一。 Eclipse作為一個強大的整合開發環境,不僅提供了許多預設的快捷鍵,還允許使用者根據自己的偏好進行個人化的客製化。本文將介紹如何在Eclipse中自訂快捷鍵設置,並給出具體的程式碼範例。打開Eclipse首先,打開Eclipse,並進入

1.下圖是edius預設的螢幕佈局,預設的EDIUS視窗佈局是橫向版式,因此在單一顯示器環境中,許多視窗是重疊在一起的,且預覽視窗為單一視窗模式。 2、您可以透過【檢視】選單列啟用【雙視窗模式】,使預覽視窗同時顯示播放視窗和錄製視窗。 3.您可以透過【檢視功能表列>視窗佈局>常規】來恢復預設螢幕佈局。另外您也可以自訂適合您的佈局方式,並儲存為常用螢幕佈局:將視窗拖曳成適合自己的佈局,然後點擊【檢視>視窗佈局>儲存目前佈局>新建】,在彈出的【儲存目前佈局】小視窗中輸入佈局名稱,按確定

隨著網路金融的快速發展,股票投資已經成為了越來越多人的選擇。而在股票交易中,蠟燭圖是常用的技術分析方法,它能夠顯示股票價格的變動趨勢,幫助投資人做出更精準的決策。本文將透過介紹PHP和JS的開發技巧,帶領讀者了解如何繪製股票蠟燭圖,並提供具體的程式碼範例。一、了解股票蠟燭圖在介紹如何繪製股票蠟燭圖之前,我們首先需要先了解什麼是蠟燭圖。蠟燭圖是由日本人

JavaScript教學:如何取得HTTP狀態碼,需要具體程式碼範例前言:在Web開發中,經常會涉及到與伺服器進行資料互動的場景。在與伺服器進行通訊時,我們經常需要取得傳回的HTTP狀態碼來判斷操作是否成功,並根據不同的狀態碼來進行對應的處理。本篇文章將教你如何使用JavaScript來取得HTTP狀態碼,並提供一些實用的程式碼範例。使用XMLHttpRequest

js和vue的關係:1、JS作為Web開發基石;2、Vue.js作為前端框架的崛起;3、JS與Vue的互補關係;4、JS與Vue的實踐應用。

在excel表格中,有時候可能需要插入座標軸,能夠更直觀地看到資料的變化趨勢。還有些小夥伴不清楚怎麼在表中插入座標軸,接下來小編就跟大家分享一下excel自訂座標軸刻度的方法吧。 座標軸插入方法: 1、在excel介面中,選取資料。 2、在插入介面中,點選插入長條圖或長條圖。 3、在展開的介面中,選擇形圖類型。 4、在表格右鍵介面中,點選選擇資料。 5、在展開的介面中,進行自訂即可。
