Bagaimana untuk Melaksanakan $(window).resize() Hanya Sekali Selepas Saiz Tetingkap Selesai?

Menyasarkan Penyelesaian Acara: $(window).resize() Selepas Pelaksanaan

Apabila menggunakan $(window).resize(function() { ... }) untuk memantau saiz semula tetingkap penyemak imbas, anda mungkin menghadapi beberapa peristiwa penembakan semasa pelarasan tetingkap manual. Isu ini timbul apabila peristiwa dicetuskan setiap kali sempadan tetingkap diseret, mengakibatkan tingkah laku yang tidak diingini. Untuk menangani perkara ini, mari kita terokai penyelesaian yang memastikan pelaksanaan berlaku semata-mata selepas proses saiz semula selesai.

Coretan kod di bawah menyediakan penyelesaian praktikal yang boleh digunakan dalam pelbagai bahagian kod anda:

<code class="javascript">var waitForFinalEvent = (function () {
  var timers = {};
  return function (callback, ms, uniqueId) {
    if (!uniqueId) {
      uniqueId = "Don't call this twice without a uniqueId";
    }
    if (timers[uniqueId]) {
      clearTimeout (timers[uniqueId]);
    }
    timers[uniqueId] = setTimeout(callback, ms);
  };
})();</code>

Untuk menggunakan penyelesaian ini, ikut langkah berikut:

1. Laksanakan pendengar acara tersuai untuk saiz semula tetingkap.

<code class="javascript">$(window).resize(function () {</code>

2. Dalam pendengar acara , mohon waitForFinalEvent untuk menetapkan tamat masa untuk panggilan balik.

<code class="javascript">    waitForFinalEvent(function(){
      alert('Resize...');
      //...
    }, 500, "some unique string");</code>

Parameter 500 mewakili kelewatan 500 milisaat, membenarkan masa yang mencukupi untuk proses mengubah saiz selesai. Parameter uniqueId memastikan bahawa berbilang panggilan balik boleh menggunakan mekanisme tamat masa yang sama tanpa gangguan.

Penyelesaian yang diubah suai ini membolehkan anda menentukan berbilang panggilan balik yang dilaksanakan selepas saiz semula tetingkap selesai, memenuhi pelbagai bahagian kod anda dengan berkesan.

Atas ialah kandungan terperinci Bagaimana untuk Melaksanakan $(window).resize() Hanya Sekali Selepas Saiz Tetingkap Selesai?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!