Bagaimanakah Saya Boleh Mengawal Keterlihatan Elemen dalam jQuery Beyond `.hide()` dan `.show()`?

Mencapai Keterlihatan Elemen dengan jQuery: Beyond .hide() dan .show()

JQuery .hide() dan .show( ) kaedah telah menjadi alat asas untuk memanipulasi keterlihatan elemen berdasarkan tetapan paparan CSS. Walau bagaimanapun, mungkin terdapat senario di mana melaraskan sifat paparan tidak mencukupi atau diingini. Untuk menangani keperluan ini, adalah mungkin untuk mencipta fungsi jQuery tersuai yang menyasarkan sifat keterlihatan.

Mencipta Fungsi Keterlihatan Tersuai

Untuk mencipta fungsi tersuai yang menyasarkan keterlihatan, kami boleh memanfaatkan kaedah .css(). Contoh berikut menunjukkan cara mentakrifkan fungsi untuk menyembunyikan, menunjukkan dan menogol keterlihatan:

jQuery.fn.visible = function() {
  return this.css('visibility', 'visible');
};

jQuery.fn.invisible = function() {
  return this.css('visibility', 'hidden');
};

jQuery.fn.visibilityToggle = function() {
  return this.css('visibility', function(i, visibility) {
    return (visibility == 'visible') ? 'hidden' : 'visible';
  });
};

Melebihi muatan togol() Fungsi

Jika penyepaduan yang lebih lancar dengan fungsi toggle() sedia ada lebih diutamakan, adalah mungkin untuk membebankannya untuk dikendalikan keterlihatan:

!(function($) {
  var toggle = $.fn.toggle;
  $.fn.toggle = function() {
    var args = $.makeArray(arguments),
      lastArg = args.pop();

    if (lastArg == 'visibility') {
      return this.visibilityToggle();
    }

    return toggle.apply(this, arguments);
  };
})(jQuery);

Dengan fungsi tersuai atau teknik beban lampau ini, anda kini boleh menguruskan keterlihatan elemen dengan mudah menggunakan sintaks jQuery yang biasa tanpa menggunakan tetapan paparan CSS.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengawal Keterlihatan Elemen dalam jQuery Beyond `.hide()` dan `.show()`?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!