Bagaimana untuk Lumpuhkan dan Dayakan Butang dan Pautan dengan jQuery dan Bootstrap?

Cara Lumpuhkan/Dayakan Butang dan Pautan Menggunakan jQuery dan Bootstrap

Memudahkan proses melumpuhkan dan mendayakan butang serta pautan meningkatkan pengalaman pengguna dan mengekalkan kawalan dalam aplikasi web . Artikel ini meneroka pelbagai teknik untuk mencapai kefungsian ini menggunakan jQuery dan Bootstrap.

Melumpuhkan Butang

Butang dalam HTML dan Bootstrap boleh dilumpuhkan dengan mudah dengan menggunakan atribut yang dilumpuhkan, yang dikendalikan secara asli oleh penyemak imbas. Untuk melumpuhkan butang menggunakan jQuery, anda boleh menggunakan kaedah fn.extend() dan mencipta fungsi disable() tersuai.

Selain itu, kaedah prop() jQuery boleh digunakan untuk melumpuhkan butang:

$('button').prop('disabled', true);
$('button').prop('disabled', false);

Melumpuhkan Teg Sauh

Teg Sauh tidak mempunyai atribut yang dilumpuhkan secara asli. Walau bagaimanapun, Bootstrap menggunakan CSS untuk menggayakan teg anchor yang dilumpuhkan dengan kelas .disabled. Kelas ini digunakan untuk menyediakan penampilan yang dilumpuhkan.

Untuk mengelakkan klik pada teg sauh yang dilumpuhkan, jQuery boleh digunakan:

$('body').on('click', 'a.disabled', function(event) {
    event.preventDefault();
});

Fungsi Lumpuh Gabungan

Untuk mengendalikan kedua-duanya butang dan tag anchor dengan cekap, fungsi disable() yang diubah suai boleh dibuat menggunakan kaedah is() jQuery untuk membezakan antara jenis elemen:

jQuery.fn.extend({
    disable: function(state) {
        return this.each(function() {
            var $this = $(this);
            if($this.is('input, button, textarea, select'))
              this.disabled = state;
            else
              $this.toggleClass('disabled', state);
        });
    }
});

Fungsi lumpuh() lanjutan ini membenarkan pengendalian yang konsisten bagi semua elemen sasaran, memastikan kedua-dua butang dan teg sauh boleh dilumpuhkan dan didayakan secara dinamik.

Atas ialah kandungan terperinci Bagaimana untuk Lumpuhkan dan Dayakan Butang dan Pautan dengan jQuery dan Bootstrap?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!