右鍵單擊一個Javascript事件？

123

正如其他人所說的，鼠標右鍵可以檢測到through the usual mouse events (mousedown, mouseup, click)。但是，如果您在右鍵單擊菜單出現時正在查找觸發事件，則表明您的位置不正確。也可以通過鍵盤訪問右鍵單擊/上下文菜單（在Windows和某些Linux上，Shift + F10或上下文菜單鍵）。在這種情況下，你要尋找的事件是oncontextmenu：

window.oncontextmenu = function() 
{ 
    showCustomMenu(); 
    return false;  // cancel default menu 
}

至於鼠標事件本身，瀏覽器設置屬性的事件對象，它是從事件處理訪問功能：

document.body.onclick = function (e) { 
    var isRightMB; 
    e = e || window.event; 

    if ("which" in e) // Gecko (Firefox), WebKit (Safari/Chrome) & Opera 
     isRightMB = e.which == 3; 
    else if ("button" in e) // IE, Opera 
     isRightMB = e.button == 2; 

    alert("Right mouse button " + (isRightMB ? "" : " was not") + "clicked!"); 
}

window.oncontextmenu - MDC

來源

2010-03-09 00:30:20

+5

就像哪個/按鈕問題一樣，'oncontextmenu'在所有瀏覽器中都沒有實現...請參閱http://www.quirksmode.org/dom/events/contextmenu.html瞭解一些「陷阱」。 – smencer 2010-03-09 01:28:21

+2

@AndyE你好安迪，表達'（isRightMB？「不是」：「」）'應該是'（isRightMB？「是」：「不是」）。對？請幫忙查看它。 – 2014-07-03 04:20:58

+1

@Joe：有趣的是，如何在沒有任何人注意的情況下選出32張選票和4年;-)然而，我認爲我可以原諒 - 現在是00:30我寫了答案！ – 2014-07-11 18:51:50

1

是 - 是！

function doSomething(e) { 
    var rightclick; 
    if (!e) var e = window.event; 
    if (e.which) rightclick = (e.which == 3); 
    else if (e.button) rightclick = (e.button == 2); 
    alert('Rightclick: ' + rightclick); // true or false 
}

來源

2010-03-09 00:22:44 ChickenMilkBomb

+0

嗯 - 技術上它不是一個「事件」，但它可以使用。 – ChickenMilkBomb 2010-03-09 00:24:24

+1

你的代碼根本不顯示某人會怎麼稱呼這個...... – 2010-03-09 00:27:38

+0

@TimothyKhouri（以及這裏的其他人）：這是一個兼容的事件監聽器函數。您可以將函數對象本身作爲第二個參數傳遞給[addEventListener]（https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener），然後它會在發生指定的事件。例如：'elem.addEventListener（「click」，doSomething）' – 2016-08-08 09:55:01

3

沒有，但你可以發現在「onmousedown事件」事件使用的是什麼鼠標按鈕...並從那裏確定它是否是一個「右擊」。

來源

2010-03-09 00:23:00

+0

所以應該右擊觸發一個onclick事件？ – Brian 2010-03-09 00:24:37

+0

你是對的，那將是onmousedown。 – 2010-03-09 00:26:06

+0

@Brian：右鍵點擊會觸發'onmousedown'，'onmouseup'和'onclick'。但是，如果您正在重寫右鍵菜單，則這些事件不是您應該使用的（請參閱下面的答案）。 – 2010-03-09 00:34:53

-2

是的，它是一個javascript mousedown事件。還有一個jQuery plugin也做不到

來源

2010-03-09 00:23:44

19

看看下面的jQuery代碼：

$("#myId").mousedown(function(ev){ 
     if(ev.which == 3) 
     { 
      alert("Right mouse button clicked on element with id myId"); 
     } 
});

的which的值將是：

用於左按鈕
爲中間按鈕
爲右按鈕

來源

2010-03-09 00:34:36

+2

Eeeew，太可怕了！爲什麼'.which'與'.button'不一樣？ O.o '.button' => * 0,1,2 *; 'which' => * 1,2,3 *。這是錯誤的。 – 2017-02-13 22:22:04

4

雅雖然w3c表示可以通過點擊事件檢測到右鍵點擊，但onClick不會通過右鍵點擊觸發通常的瀏覽器。

實際上，右擊只觸發onMouseDown onMouseUp和onContextMenu。

因此，您可以將「onContextMenu」視爲右鍵單擊事件。這是一個HTML5.0標準。

來源

2013-01-15 03:27:00 Eric

+1

是的，聽起來像是一個很好的解決方案，特別是如果你的目標是新的瀏覽器。我不認爲這只是一個HTML5.0，因爲即使IE 5.5支持它的元素！下面是更多關於哪些瀏覽器支持它：http://www.quirksmode.org/dom/events/contextmenu.html – Ignas2526 2013-11-14 23:19:58

0

使用jQuery庫

$(window).on("contextmenu", function(e) 
{ 
    alert("Right click"); 
})

來源

2014-06-06 15:54:10 Ilya

1

是，oncontextmenu可能是最好的選擇，但要知道，它觸發上按下鼠標點擊而將觸發鼠標向上處理事件。

其他相關的問題都是關於雙擊右鍵的問題 - 除了通過手動定時器檢查，顯然不支持。您可能希望能夠右鍵雙擊的一個原因是您需要/想要支持左手鼠標輸入（按鈕反轉）。瀏覽器的實現似乎對我們應該如何使用可用的輸入設備做了很多假設。

來源

2014-06-25 17:48:35 phbcanada

5

的我的回答是window.oncontextmenu，例如：

window.oncontextmenu = function() { 
 
    alert('Right Click') 
 
}

<h1>Please Right Click here!</h1>

來源

2015-09-27 17:01:10 user12345678

2

下面的代碼使用jQuery生成基於默認mousedown和mouseup事件自定義rightclick事件。它認爲有以下幾點：

在鼠標鬆開扳機
這段代碼還特別適用於JFX網頁視圖之前相同的元素上按下鼠標按下
觸發（因爲contextmenu事件不會觸發那裏）
當按下鍵盤上的文本菜單鍵也不會觸發（如與on('contextmenu', ...)的解決方案確實

$(function() 
 
{ // global rightclick handler - trigger custom event "rightclick" 
 
\t var mouseDownElements = []; 
 
\t $(document).on('mousedown', '*', function(event) 
 
\t { 
 
\t \t if (event.which == 3) 
 
\t \t { 
 
\t \t \t mouseDownElements.push(this); 
 
\t \t } 
 
\t }); 
 
\t $(document).on('mouseup', '*', function(event) 
 
\t { 
 
\t \t if (event.which == 3 && mouseDownElements.indexOf(this) >= 0) 
 
\t \t { 
 
\t \t \t $(this).trigger('rightclick'); 
 
\t \t } 
 
\t }); 
 
\t $(document).on('mouseup', function() 
 
\t { 
 
\t \t mouseDownElements.length = 0; 
 
\t }); 
 
    // disable contextmenu 
 
    $(document).on('contextmenu', function(event) 
 
\t { 
 
\t \t event.preventDefault(); 
 
\t }); 
 
}); 
 

 

 

 
// Usage: 
 
$('#testButton').on('rightclick', function(event) 
 
{ 
 
    alert('this was a rightclick'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="testButton">Rightclick me</button>

來源

2015-12-11 12:04:18

0

如果你想調用的函數，而右鍵單擊事件意味着我們可以使用下面的

<html lang="en" oncontextmenu="func(); return false;"> 
</html> 

<script> 
function func(){ 
alert("Yes"); 
} 
</script>

來源

2016-02-15 12:19:01

-1

從鼠標處理右鍵，就可以使用「oncontextmenu」事件。下面是一個示例：

document.body.oncontextmenu=function(event) { 
    alert(" Right click! "); 
};

上述代碼在按下右鍵單擊時會提示某些文本。如果您不希望瀏覽器的默認菜單出現，則可以添加返回false; 在函數內容的末尾。謝謝。

來源

2016-11-25 02:58:49

+0

而不是簡單地回答一個促進一些框架的答案，如果它包含一個香草JS，您的答案會更有用解決方案，然後可能會詳細闡述它以描述如何更容易地使用您的框架。 – Xaniff 2016-11-25 03:20:07

+0

好的...感謝您的推薦..它實際上很容易與vanilA js – 2016-11-25 16:18:55

0

最簡單的辦法是使用

$('classx').on('contextmenu', function (event) { 

});

右鍵做然而這不是跨瀏覽器解決方案，瀏覽器不同的行爲此事件特別是Firefox和IE。我會建議下面的跨瀏覽器解決方案

$('classx').on('mousedown', function (event) { 
    var keycode = (event.keyCode ? event.keyCode : event.which); 
    if (keycode === 3) { 
     //your right click code goes here  
    } 
});

來源

2017-04-17 12:56:17

右鍵單擊一個Javascript事件？

回答

相關問題