Saya bingung ketika datang untuk menonaktifkan <tombol>
, <input>
atau <a>
elemen dengan kelas: .btn
atau .btn-primary
, dengan JavaScript/jQuery.
Saya telah menggunakan cuplikan berikut untuk melakukannya:
$('button').addClass('btn-disabled');
$('button').attr('disabled', 'disabled');
$('button').prop('disabled', true);
Jadi, jika saya hanya memberikan $('tombol').addClass('btn-keluarga');
untuk elemen saya, itu akan muncul sebagai tamu dengan kebutuhan khusus, secara visual, tetapi fungsi akan tetap sama dan akan diklik nontheless, jadi itu alasan mengapa saya menambahkan y
dan prop
pengaturan untuk elemen.
Apakah ada yang expirenced masalah yang sama di luar sana? Apakah ini cara yang tepat untuk melakukan hal ini - saat menggunakan Twitter's Bootstrap?
Membangun off jeroenk's jawaban, di sini's the rundown:
$('button').addClass('disabled'); // Disables visually
$('button').prop('disabled', true); // Disables visually + functionally
$('input[type=button]').addClass('disabled'); // Disables visually
$('input[type=button]').prop('disabled', true); // Disables visually + functionally
$('a').addClass('disabled'); // Disables visually
$('a').prop('disabled', true); // Does nothing
$('a').attr('disabled', 'disabled'); // Disables visually
Lihat [biola][2]
Cara termudah untuk melakukan hal ini, adalah dengan menggunakan cacat
atribut, seperti yang telah anda lakukan pada pertanyaan awal:
<tombol class="btn btn-keluarga" keluarga>Isi dari Tombol</tombol>
Sekarang, Twitter Bootstrap doesn't memiliki metode untuk menonaktifkan tombol's fungsi tanpa menggunakan cacat
atribut.
Meskipun demikian, ini akan menjadi fitur yang sangat baik bagi mereka untuk menerapkan mereka ke perpustakaan javascript.
Apa yang pernah atribut ditambahkan ke tombol/anchor/link untuk menonaktifkannya, bootstrap adalah hanya menambahkan gaya dan pengguna masih akan dapat klik ini sementara masih ada event onclick. Jadi saya solusi sederhana adalah untuk memeriksa apakah itu adalah cacat dan menghapus/menambahkan onclick event:
if (!('#button').hasAttr('disabled'))
$('#button').attr('onclick', 'someFunction();');
else
$('#button').removeattr('onclick');