JS oncontextmenu事件使用說明

閱讀量： 246 發(fā)布日期： 2022-10-28 12:29:49

如果您正在尋找一種方法來為您的網(wǎng)站添加一些交互性，JavaScript是最適合使用的語言。使用JavaScript，您可以創(chuàng)建當(dāng)用戶右鍵單擊頁面上的元素時(shí)彈出的菜單。本教程將向您展示如何使用JavaScript創(chuàng)建上下文菜單。

1、JavaScript oncontextmenu事件

oncontextmenu事件會(huì)在用戶點(diǎn)擊鼠標(biāo)右鍵時(shí)觸發(fā)。

2、oncontextmenu事件的使用說明

oncontextmenu事件會(huì)在用戶點(diǎn)擊對(duì)象右鍵時(shí)發(fā)生。在用戶點(diǎn)擊對(duì)象右鍵時(shí)，oncontextmenu事件就會(huì)被觸發(fā)。通過這個(gè)事件，我們可以實(shí)現(xiàn)一些功能，比如彈出菜單、顯示信息等。

3、實(shí)例演示

我們通過下面的實(shí)例來演示oncontextmenu事件的使用：首先在HTML頁面中定義了一個(gè)菜單，然后使用oncontextmenu事件來實(shí)現(xiàn)當(dāng)右鍵點(diǎn)擊時(shí)彈出菜單。實(shí)例

示例1：

<!DOCTYPE html>

<html>

<title>JS oncontextmenu事件</title>

<!--

function uFunction()

{

　　document.all.infop.innerHTML='鼠標(biāo)右鍵，不顯示！';

}

function uFunction2()

{

　　document.all.infop.innerHTML='Ctrl+鼠標(biāo)右鍵，可以顯示。';

}

//-->

</script>

</head>

　　<p id="infop">你鼠標(biāo)右鍵，右鍵菜單不顯示！<br>Ctrl+鼠標(biāo)右鍵，可以顯示右鍵菜單。

　　</p>

</body>

</html>

示例2：

<!DOCTYPE html>

<html>

<head>

<title>OnMousedown、OnContextmenu為表格添加鼠標(biāo)左中右鍵單擊</title>

　　　　var keyArray = new Array(

　　　　new Array(0, "右鍵"),

　　　　new Array(1, "左鍵"),

　　　　new Array(2, "右鍵"), //

　　　　new Array(3, "左鍵右鍵同時(shí)按"),//

　　　　new Array(4, "中鍵")

　　　　//測(cè)試同時(shí)按兩個(gè)鍵更多的表示

　　　　//new Array(6, "中鍵右鍵同時(shí)按")

　　　　);

　　　　function Click()

　　　　{

　　　　var message = GetKeyMessage(event.button);

　　　　alert(message);

　　　　if (event.button == 2 || event.button == 0) //按右鍵

　　　　 {

　　　　//處理代碼

　　　　}

　　　　function GetKeyMessage(button)

　　　　{

　　　　for (var i = 0; i < keyArray.length; i++)

　　　　{

　　　　if (keyArray[i][0] == button)

　　　　{

　　　　return keyArray[i][1] + "， event.button = " + button;

　　　　}

　　　　 return "組合鍵， event.button = " + button;

　　　　}

　　</script>

</head>

<body>

<tr>

<td oncontextmenu="return false" onmousedown="Click()">請(qǐng)分別用左鍵、右鍵、中鍵、左鍵右鍵組合點(diǎn)測(cè)試</td>

</tr>

<tr>

<td>表格沒處理，點(diǎn)擊沒反應(yīng)</td>

</tr>

</table>

</body>

</html>

謝謝你的閱讀！如果你有任何問題，請(qǐng)?jiān)谙旅媪粞浴?/span>

作者: bosscms，轉(zhuǎn)載時(shí)必須經(jīng)得同意并以鏈接形式注明作者和原始出處及本聲明。

?JavaScript

上一篇：: htaccess是什么文件,htaccess文件在服務(wù)器的用途

下一篇：: sandisk secureaccess是什么軟件，安裝使用方法

午夜福利欧美,国产精品va一区二区三区,欧美日韩一区二区高清,区二区三区_久久精品国产

JS oncontextmenu事件使用說明

熱點(diǎn)推薦

相關(guān)模板推薦

無人機(jī)充電樁IT科技網(wǎng)站模板

HY011免費(fèi)模板

HY010免費(fèi)模板(帶商城功能)

HY009免費(fèi)模板

HY008免費(fèi)模板

HY007免費(fèi)模板

聯(lián)系方式