Bagaimana untuk menentukan sama ada butang kiri tetikus ditekan dalam javascript

Dalam JavaScript, adalah keperluan biasa untuk menentukan sama ada butang kiri tetikus ditekan. Dalam aplikasi web yang menggunakan tetikus untuk berinteraksi, kita biasanya mahu dapat memantau dalam masa nyata sama ada butang kiri tetikus ditekan apabila pengguna menggerakkan tetikus, supaya operasi seterusnya boleh dilakukan. Artikel ini akan memperkenalkan beberapa teknik dan kaedah untuk merealisasikan pertimbangan menekan butang tetikus kiri.

1. Gunakan sifat butang objek MouseEvent untuk menentukan sama ada butang kiri tetikus ditekan

Apabila tetikus bergerak, penyemak imbas akan mencetuskan acara MouseEvent. Objek MouseEvent mengandungi sifat butang, yang menunjukkan butang pada tetikus yang sedang ditekan. Untuk butang kiri tetikus, nilai atribut butang ialah 1. Oleh itu, kita boleh menentukan sama ada butang kiri tetikus ditekan dengan menentukan sama ada sifat butang objek MouseEvent adalah sama dengan 1. Berikut ialah kod contoh mudah:

document.addEventListener('mousemove', function(event) {
  if (event.buttons === 1) {
    console.log('鼠标左键被按下了');
  }
});

2. Nilai sama ada butang kiri tetikus ditekan dengan menilai sifat butang acara turun tetikus dan tetikus

Apabila tetikus ditekan Apabila turun atau dilepaskan, penyemak imbas akan mencetuskan acara turun tetikus dan naik tetikus masing-masing. Objek MouseEvent mengandungi sifat butang, yang menunjukkan butang tetikus yang ditekan atau dilepaskan. Untuk butang tetikus kiri, nilai sifat butang ialah 0. Oleh itu, kita boleh menentukan sama ada butang kiri tetikus ditekan dengan menentukan sama ada sifat butang acara turun tetikus dan naik tetikus adalah sama dengan 0. Berikut ialah kod sampel:

document.addEventListener('mousedown', function(event) {
  if (event.button === 0) {
    console.log('鼠标左键被按下了');
  }
});

document.addEventListener('mouseup', function(event) {
  if (event.button === 0) {
    console.log('鼠标左键被释放了');
  }
});

Perlu diambil perhatian bahawa dalam kod sampel di atas, kami mendengar acara turun tetikus dan naik tetikus masing-masing. Ini kerana apabila butang tetikus kiri ditekan, peristiwa turun tetikus dicetuskan apabila butang tetikus kiri dilepaskan, peristiwa tetikus naik tercetus.

3. Simpan butang kiri tetikus keadaan bawah dengan menggunakan pembolehubah global atau penutupan

Dalam sesetengah kes, kita mungkin perlu menyimpannya dalam tempoh yang lebih lama. keadaan butang tetikus kiri, dan lakukan beberapa operasi berdasarkan ini. Pada masa ini, kita boleh menggunakan pembolehubah global atau penutupan untuk menyimpan keadaan butang tetikus kiri yang ditekan. Berikut ialah kod sampel:

var isMouseDown = false;

document.addEventListener('mousedown', function(event) {
  if (event.button === 0) {
    isMouseDown = true;
  }
});

document.addEventListener('mouseup', function(event) {
  if (event.button === 0) {
    isMouseDown = false;
  }
});

document.addEventListener('mousemove', function(event) {
  if (isMouseDown) {
    console.log('鼠标左键被按下了');
    // 进行一些操作
  }
});

Dalam kod sampel di atas, kami menyimpan keadaan butang tetikus kiri yang ditekan melalui pembolehubah global isMouseDown. Apabila butang kiri tetikus ditekan, kami menetapkan isMouseDown kepada benar apabila butang kiri tetikus dilepaskan, kami menetapkan isMouseDown kepada false. Dalam fungsi mendengar acara pergerakan tetikus, sesetengah operasi dilakukan hanya apabila isMouseDown adalah benar.

Ringkasan

Dalam JavaScript, adalah keperluan biasa untuk menentukan sama ada butang kiri tetikus ditekan. Artikel ini memperkenalkan tiga teknik dan kaedah untuk menentukan sama ada butang kiri tetikus ditekan. Khususnya, kita boleh mencapai fungsi ini melalui sifat butang objek MouseEvent, sifat butang acara turun tetikus dan naik tetikus, atau menggunakan pembolehubah global atau penutupan untuk menyimpan keadaan ditekan butang tetikus kiri. Dalam pembangunan sebenar, kita boleh memilih untuk menggunakan teknik dan kaedah yang sepadan mengikut keperluan tertentu.

Atas ialah kandungan terperinci Bagaimana untuk menentukan sama ada butang kiri tetikus ditekan dalam javascript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!