kaedah jquery melambatkan pelaksanaan

PHPz
Lepaskan: 2023-05-14 13:09:37
asal
1540 orang telah melayarinya

Dengan pembangunan berterusan teknologi JavaScript, pembangun bahagian hadapan sering menggunakan perpustakaan JavaScript jQuery dalam pembangunan harian. Terdapat banyak kaedah dalam jQuery yang boleh membantu kami menyelesaikan pelbagai tugas biasa dengan cepat Antaranya, melambatkan pelaksanaan kaedah juga merupakan keperluan biasa Artikel ini akan meneroka bagaimana untuk menangguhkan pelaksanaan kaedah dari perspektif kaedah jQuery.

Mula-mula, mari kita lihat keperluan biasa: peristiwa akan dicetuskan apabila tetikus meluncur ke atas elemen, dan acara lain akan dilaksanakan selepas kelewatan apabila tetikus bergerak menjauhi elemen. Pada masa ini, kita boleh menggunakan kaedah kelewatan jQuery untuk mencapai keperluan ini Contoh kod adalah seperti berikut:

$('#target-element')
  .on('mouseenter', function() {
    // 鼠标滑过时执行的方法
  })
  .on('mouseleave', function() {
    $(this).delay(1000).queue(function() {
      // 延时1秒执行的方法
      $(this).dequeue();
    });
  });
Salin selepas log masuk

Dalam contoh di atas, kami menggunakan kaedah kelewatan dalam kaedah pencetus peristiwa pergerakan tetikus untuk menetapkan. masa kelewatan, tetapkan kepada 1000 milisaat, dan kemudian gunakan baris gilir untuk mengawal perintah pelaksanaan. Selepas kaedah pelaksanaan tertunda dilaksanakan, gunakan kaedah dequeue untuk mengosongkan baris gilir bagi memastikan kaedah seterusnya dapat dilaksanakan dengan lancar.

Selain kaedah kelewatan, kaedah lain yang biasa digunakan dalam jQuery ialah setTimeout Kaedah ini adalah sebahagian daripada API standard JavaScript dan boleh dilaksanakan sekali selepas masa yang ditentukan. Kita boleh menggunakan kaedah setTimeout dalam kombinasi dengan kaedah baris gilir jQuery untuk menangguhkan pelaksanaan kaedah Kod sampel adalah seperti berikut:

$('#target-element')
  .on('mouseenter', function() {
    // 鼠标滑过时执行的方法
  })
  .on('mouseleave', function() {
    var $this = $(this);
    setTimeout(function() {
      $this.queue(function() {
        // 延时1秒执行的方法
        $this.dequeue();
      });
    }, 1000);
  });
Salin selepas log masuk

Dalam contoh di atas, kami menetapkan masa tunda kaedah setTimeout kepada. 1000 milisaat Kaedah giliran dan dequeue digunakan dalam fungsi panggil balik untuk mengawal susunan pelaksanaan kaedah pelaksanaan tertunda dan kaedah seterusnya.

Perlu diambil perhatian bahawa apabila menggunakan kaedah setTimeout untuk menangguhkan pelaksanaan kaedah, kita perlu menyimpan objek jQuery dalam pembolehubah untuk mengelakkan ralat penunjuk ini dalam kaedah pelaksanaan tertunda.

Secara amnya, sama ada anda menggunakan kaedah kelewatan atau kaedah setTimeout untuk menangguhkan pelaksanaan sesuatu kaedah, anda harus memilih kaedah yang sesuai berdasarkan keperluan khusus. Jika anda hanya melambatkan pelaksanaan kaedah, menggunakan kaedah kelewatan boleh menjadi lebih mudah dan lebih mudah jika anda memerlukan kawalan kelewatan yang lebih kompleks dan susunan pelaksanaan kaedah berikutnya, menggunakan kaedah setTimeout yang digabungkan dengan baris gilir jQuery; fleksibel dan boleh dikawal.

Selain daripada dua kaedah ini, anda juga boleh menggunakan Promise, setTimeout, $.Deferred dan kaedah lain untuk melaksanakan pelaksanaan tertunda bagi sesuatu kaedah Dalam pembangunan sebenar, anda perlu memilih mengikut situasi tertentu. Tanpa mengira pendekatan, pembangun bahagian hadapan harus menguasai kemahiran ini untuk lebih berupaya menangani pelbagai keperluan dan masalah biasa.

Atas ialah kandungan terperinci kaedah jquery melambatkan pelaksanaan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!