Bagaimana untuk Melaksanakan Kelewatan Masa dalam JavaScript untuk Gelagat Togol Imej?

Melaksanakan Kelewatan Masa dalam JavaScript

Dalam bidang pembangunan web, mengawal masa pelbagai acara adalah penting untuk mewujudkan mesra pengguna dan pengalaman interaktif. Satu keperluan biasa ialah memperkenalkan kelewatan masa untuk mengelakkan tindakan pantas atau berulang yang dicetuskan oleh input pengguna.

Secara khusus, JavaScript menyediakan kaedah serba boleh untuk mencapai kelewatan masa. Apabila bekerja dengan imej, seperti yang berlaku dalam kod yang disediakan, anda boleh menggunakan fungsi setTimeout() untuk menjeda pelaksanaan kod JavaScript untuk tempoh tertentu.

Dalam kod anda, anda bertujuan untuk mencipta gelagat togol di mana mengklik imej menukar sumbernya kepada "img_onclick.jpg" dan mencetuskan kelewatan 1000 milisaat (1 saat) sebelum kembali kepada "img.jpg". Untuk mencapai matlamat ini, kami memperkenalkan fungsi setTimeout() seperti berikut:

<code class="javascript">var delayInMilliseconds = 1000; // Set the desired delay

$(".trigger").click(function() {
  // Code to handle image toggle
  $(this).next(".toggle-container").slideToggle();
  setTimeout(function() {
    $(this).find('img').prop('src', 'http://localhost:8888/images/img.jpg');
  }, delayInMilliseconds);
});</code>

Dengan membalut kod yang mengembalikan sumber imej dalam fungsi setTimeout() , kami membuat kelewatan selepas operasi togol dilakukan. Ini memastikan bahawa imej "img.jpg" tidak dipaparkan serta-merta selepas mengklik imej "img_onclick.jpg".

Untuk pendekatan alternatif tanpa menggunakan setTimeout(), rujuk soalan ini .

Atas ialah kandungan terperinci Bagaimana untuk Melaksanakan Kelewatan Masa dalam JavaScript untuk Gelagat Togol Imej?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!