Apakah klik kanan acara Javascript?

Apakah klik kanan acara Javascript? Jika demikian, bagaimana cara menggunakannya?

Seperti yang telah disebutkan orang lain, tombol kanan mouse dapat dideteksi melalui peristiwa mouse biasa (mouseous, mouseup, klik) . Namun, jika Anda mencari acara pembakaran ketika menu klik kanan muncul, Anda mencari di tempat yang salah. Menu klik kanan / konteks juga dapat diakses melalui keyboard (shift + F10 atau tombol menu konteks pada Windows dan beberapa Linux). Dalam situasi ini, acara yang Anda cari adalah oncontextmenu:

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

Sedangkan untuk acara mouse sendiri, browser menetapkan properti ke objek acara yang dapat diakses dari fungsi penanganan acara:

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

lihat kode jQuery berikut:

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

Nilai whichakan:

• 1 untuk tombol kiri
• 2 untuk tombol tengah
• 3 untuk tombol kanan

Anda dapat menggunakan acara tersebut window.oncontextmenu, misalnya:

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

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

Ya, meskipun w3c mengatakan klik kanan dapat dideteksi oleh peristiwa klik, onClick tidak dipicu melalui klik kanan di browser biasa.

Bahkan, klik kanan hanya memicu onMouseDown onMouseUp dan onContextMenu.

Dengan demikian, Anda dapat menganggap "onContextMenu" sebagai acara klik kanan. Ini adalah standar HTML5.0.

Jika Anda ingin mendeteksi klik kanan mouse, Anda tidak boleh menggunakan MouseEvent.whichproperti karena tidak standar dan ada banyak ketidakcocokan di antara browser. (lihat MDN ) Anda sebaiknya menggunakan MouseEvent.button. Ini mengembalikan angka yang mewakili tombol yang diberikan:

• 0: Tombol utama ditekan, biasanya tombol kiri atau keadaan tidak diinisialisasi
• 1: Tombol bantu ditekan, biasanya tombol roda atau tombol tengah (jika ada)
• 2: Tombol sekunder ditekan, biasanya tombol kanan
• 3: Tombol keempat, biasanya tombol Browser Back
• 4: Tombol kelima, biasanya tombol Browser Forward

MouseEvent.button menangani lebih banyak tipe input daripada hanya mouse standar:

Tombol dapat dikonfigurasi secara berbeda dengan tata letak standar "kiri ke kanan". Mouse yang dikonfigurasikan untuk penggunaan tangan kiri mungkin memiliki tindakan tombol terbalik. Beberapa perangkat penunjuk hanya memiliki satu tombol dan menggunakan keyboard atau mekanisme input lain untuk mengindikasikan utama, sekunder, tambahan, dll. Lainnya mungkin memiliki banyak tombol yang dipetakan ke berbagai fungsi dan nilai tombol.

Referensi:

1. https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/which
2. https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button

Tidak, tetapi Anda dapat mendeteksi tombol mouse apa yang digunakan dalam acara "onmousedown" ... dan dari sana menentukan apakah itu "klik kanan".

Kode berikut menggunakan jQuery untuk menghasilkan rightclickacara khusus berdasarkan default mousedowndan mouseupacara. Itu mempertimbangkan hal-hal berikut:

• pemicu pada mouseup
• memicu hanya ketika ditekan mousedown pada elemen yang sama sebelumnya
• kode ini terutama juga berfungsi di JFX Webview (karena contextmenuacara tidak dipicu di sana)
• itu TIDAK memicu ketika tombol menu konteks pada keyboard ditekan (seperti solusi dengan on('contextmenu', ...)tidak

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



// 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>

Ya itu!

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
}

Ya, oncontextmenu mungkin merupakan alternatif terbaik tetapi perlu diketahui bahwa itu memicu pada mouse ke bawah sedangkan klik akan memicu pada mouse ke atas.

Pertanyaan terkait lainnya adalah tentang klik ganda kanan - yang tampaknya tidak didukung kecuali melalui pemeriksaan timer manual. Salah satu alasan Anda mungkin ingin memiliki klik ganda kanan adalah jika Anda perlu / ingin mendukung input mouse tangan kiri (pembalikan tombol). Implementasi browser tampaknya membuat banyak asumsi tentang bagaimana kita seharusnya menggunakan perangkat input yang tersedia.

Cara termudah untuk menyelesaikan klik kanan adalah menggunakan

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

 });

Namun ini bukan solusi lintas browser, browser berperilaku berbeda untuk acara ini terutama firefox dan IE. Saya akan merekomendasikan di bawah ini untuk solusi lintas browser

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

Itu adalah cara termudah untuk mengaktifkannya, dan berfungsi di semua browser kecuali tampilan web aplikasi seperti (CefSharp Chromium dll ...). Saya harap kode saya akan membantu Anda dan semoga berhasil!

const contentToRightClick=document.querySelector("div#contentToRightClick");

//const contentToRightClick=window; //If you want to add it into the whole document

contentToRightClick.oncontextmenu=function(e){
  e=(e||window.event);
  e.preventDefault();
  console.log(e);
  
  return false; //Remove it if you want to keep the default contextmenu 
}

div#contentToRightClick{
  background-color: #eee;
  border: 1px solid rgba(0,0,0,.2);
  overflow: hidden;
  padding: 20px;
  height: 150px;
}

<div id="contentToRightClick">Right click on the box !</div>

Jika Anda ingin memanggil fungsi sementara acara klik kanan berarti kita dapat menggunakan berikut ini

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

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

Ini berhasil dengan saya

if (evt.xa.which == 3) 
{
    alert("Right mouse clicked");
}

Cobalah menggunakan whichdan / atau buttonproperti

The demo

function onClick(e) {
  if (e.which === 1 || e.button === 0) {
    console.log('Left mouse button at ' + e.clientX + 'x' + e.clientY);
  }
  if (e.which === 2 || e.button === 1) {
    console.log('Middle mouse button ' + e.clientX + 'x' + e.clientY);
  }
  if (e.which === 3 || e.button === 2) {
    console.log('Right mouse button ' + e.clientX + 'x' + e.clientY);
  }
  if (e.which === 4 || e.button === 3) {
    console.log('Backward mouse button ' + e.clientX + 'x' + e.clientY);
  }
  if (e.which === 5 || e.button === 4) {
    console.log('Forward mouse button ' + e.clientX + 'x' + e.clientY);
  }
}
window.addEventListener("mousedown", onClick);

Beberapa info di sini

Menangani acara menggunakan jQueryperpustakaan

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

Untuk menangani klik kanan dari mouse, Anda dapat menggunakan acara 'oncontextmenu'. Di bawah ini adalah contohnya:

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

kode di atas mengingatkan beberapa teks ketika klik kanan ditekan. Jika Anda tidak ingin menu default browser muncul, Anda dapat menambahkan return false; Di akhir konten fungsi. Terima kasih.

Ya, ini adalah javascript event mousedown. Ada juga plugin jQuery untuk melakukannya