Bagaimana Mengendalikan Ubah Saiz Acara dengan Cekap dengan Pengendalian Acara Tertunda?

Pengendalian Acara Tertunda untuk Acara Ubah Saiz

Apabila mengendalikan acara ubah saiz dalam JavaScript, adalah perkara biasa untuk menghadapi berbilang panggilan semasa proses mengubah saiz. Ini boleh membawa kepada isu prestasi atau tingkah laku yang tidak diingini. Untuk menangani perkara ini, pertimbangkan untuk menggunakan pendekatan pengendalian acara tertunda.

Menggunakan setTimeout() dan clearTimeout()

Satu penyelesaian yang berkesan ialah menggunakan setTimeout() dan clearTimeout () fungsi. Begini caranya:

function resizedw() {
    // Haven't resized in 100ms!
}

var doit;
window.onresize = function() {
    clearTimeout(doit);
    doit = setTimeout(resizedw, 100);
};

Dalam penyelesaian ini:

• Fungsi resizedw digunakan hanya selepas tiada peristiwa ubah saiz untuk kelewatan yang ditentukan (dalam kes ini, 100 milisaat).
• clearTimeout() digunakan untuk membatalkan sebarang seruan resizedw belum selesai yang dicetuskan oleh peristiwa ubah saiz sebelumnya.
• setTimeout() menjadualkan seruan resizedw baharu selepas kelewatan, memastikan ia berlaku sekali sahaja selepas acara ubah saiz terakhir.

Pendekatan ini membolehkan anda menangguhkan tindakan sehingga tamat acara ubah saiz, menghalang berbilang pelaksanaan.

Atas ialah kandungan terperinci Bagaimana Mengendalikan Ubah Saiz Acara dengan Cekap dengan Pengendalian Acara Tertunda?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!