Bagaimana untuk Mencetuskan Peristiwa untuk Div ​​yang Boleh Dilihat dalam jQuery?

Menggunakan jQuery untuk Mencetuskan Peristiwa untuk div Kelihatan

Dalam jQuery, anda boleh melampirkan pengendali acara "tidak kelihatan" untuk memantau keterlihatan elemen div dan mencetuskan tindakan tertentu apabila ia menjadi kelihatan.

Pseudokod yang disediakan boleh dilaksanakan seperti berikut:

<code class="js">$(function () {
  $('#contentDiv').on('isVisible', function () {
    alert("do something");
  });
});</code>

Kod ini memberikan pengendali acara kepada div #contentDiv yang melaksanakan fungsi amaran apabila div menjadi kelihatan .

Pendekatan Sambungan jQuery:

Sebagai alternatif, anda boleh melanjutkan kaedah .show() untuk mencetuskan peristiwa sebelum dan selepas div ditunjukkan:

Sambungan:

<code class="js">jQuery(function ($) {
  var _oldShow = $.fn.show;

  $.fn.show = function (speed, oldCallback) {
    return $(this).each(function () {
      var obj = $(this);
      var newCallback = function () {
        if ($.isFunction(oldCallback)) {
          oldCallback.apply(obj);
        }
        obj.trigger('afterShow');
      };

      obj.trigger('beforeShow');
      _oldShow.apply(obj, [speed, newCallback]);
    });
  };
});</code>

Penggunaan:

<code class="js">$('#test')
  .on('beforeShow', function () {
    alert('beforeShow');
  })
  .on('afterShow', function () {
    alert('afterShow');
  })
  .show(1000, function () {
    alert('in show callback');
  })
  .show();</code>

Dengan pendekatan ini, anda boleh mencetuskan peristiwa sebelum dan selepas div ditunjukkan sambil mengekalkan tingkah laku kaedah .show() asal.

Atas ialah kandungan terperinci Bagaimana untuk Mencetuskan Peristiwa untuk Div ​​yang Boleh Dilihat dalam jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!