Pertanyaan Nonaktifkan / aktifkan masukan dengan jQuery?


$input.disabled = true;

atau

$input.disabled = "disabled";

Yang mana cara standarnya? Dan, sebaliknya, bagaimana Anda mengaktifkan input yang dinonaktifkan?


1910
2017-09-12 05:21


asal


Jawaban:


jQuery 1.6+

Untuk mengubah disabled milik Anda harus menggunakan .prop() fungsi.

$("input").prop('disabled', true);
$("input").prop('disabled', false);

jQuery 1.5 dan di bawah

Itu .prop() fungsi tidak ada, tapi .attr() tidak mirip:

Setel atribut yang dinonaktifkan.

$("input").attr('disabled','disabled');

Untuk mengaktifkan lagi, metode yang tepat adalah menggunakan .removeAttr()

$("input").removeAttr('disabled');

Di jQuery versi apa pun

Anda selalu dapat mengandalkan objek DOM yang sebenarnya dan mungkin sedikit lebih cepat daripada dua opsi lainnya jika Anda hanya berurusan dengan satu elemen:

// assuming an event handler thus 'this'
this.disabled = true;

Keuntungan menggunakan .prop() atau .attr() metode adalah bahwa Anda dapat mengatur properti untuk sekelompok item yang dipilih.


catatan: Di 1.6 ada a .removeProp() metode yang terdengar sangat mirip removeAttr(), tetapi TIDAK HARUS DIGUNAKAN pada properti asli seperti 'disabled'  Kutipan dari dokumentasi:

Catatan: Jangan gunakan metode ini untuk menghapus properti asli seperti dicentang, dinonaktifkan, atau dipilih. Ini akan menghapus properti sepenuhnya dan, setelah dihapus, tidak dapat ditambahkan lagi ke elemen. Gunakan .prop () untuk mengatur properti ini ke false sebagai gantinya.

Bahkan, saya ragu ada banyak kegunaan yang sah untuk metode ini, alat peraga boolean dilakukan sedemikian rupa sehingga Anda harus mengaturnya ke false bukannya "menghapus" mereka seperti rekan "atribut" mereka dalam 1,5


3289
2017-09-12 05:23



Hanya demi konvensi baru & & membuatnya beradaptasi maju (kecuali hal-hal berubah secara drastis dengan ECMA6 (????):

$(document).on('event_name', '#your_id', function() {
    $(this).removeAttr('disabled');
});

dan

$(document).off('event_name', '#your_id', function() {
    $(this).attr('disabled','disabled');   
});

51
2017-07-18 11:51



    // Disable #x
    $( "#x" ).prop( "disabled", true );
    // Enable #x
    $( "#x" ).prop( "disabled", false );

Terkadang Anda perlu menonaktifkan / mengaktifkan elemen bentuk seperti input atau textarea. Jquery membantu Anda dengan mudah membuat ini dengan menyetel atribut yang dinonaktifkan menjadi "nonaktif". Misalnya:

  //To disable 
  $('.someElement').attr('disabled', 'disabled');

Untuk mengaktifkan elemen yang dinonaktifkan, Anda perlu menghapus atribut "dinonaktifkan" dari elemen ini atau mengosongkan string. Untuk misalnya:

//To enable 
$('.someElement').removeAttr('disabled');

// OR you can set attr to "" 
$('.someElement').attr('disabled', '');

lihat:http://garmoncheg.blogspot.fr/2011/07/how-to-disableenable-element-with.html


25
2018-04-07 10:27



$("input")[0].disabled = true;

atau

$("input")[0].disabled = false;

12
2017-09-06 14:53



Anda dapat menempatkan ini di suatu tempat global dalam kode Anda:

$.prototype.enable = function () {
    $.each(this, function (index, el) {
        $(el).removeAttr('disabled');
    });
}

$.prototype.disable = function () {
    $.each(this, function (index, el) {
        $(el).attr('disabled', 'disabled');
    });
}

Dan kemudian Anda dapat menulis hal-hal seperti:

$(".myInputs").enable();
$("#otherInput").disable();

7
2017-10-18 13:42



Jika Anda hanya ingin membalikkan keadaan saat ini (seperti perilaku tombol toggle):

$("input").prop('disabled', ! $("input").prop('disabled') );

4
2017-09-12 16:28



Pembaruan untuk 2018:

Sekarang tidak perlu jQuery dan sudah lama sejak itu document.querySelector  atau document.querySelectorAll (untuk banyak elemen) melakukan pekerjaan yang hampir persis sama dengan $, plus yang lebih eksplisit getElementById, getElementsByClassName, getElementsByTagName

Menonaktifkan satu bidang kelas "masukan-centang"

document.querySelector('.input-checkbox').disabled = true;

atau beberapa elemen

document.querySelectorAll('.input-checkbox').forEach(el => el.disabled = true);

2
2018-02-11 18:29



Anda dapat menggunakan metode jQuery prop () untuk menonaktifkan atau mengaktifkan elemen formulir atau mengontrol secara dinamis menggunakan jQuery. Metode prop () membutuhkan jQuery 1.6 dan di atasnya.

Contoh:

<script type="text/javascript">
        $(document).ready(function(){
            $('form input[type="submit"]').prop("disabled", true);
            $(".agree").click(function(){
                if($(this).prop("checked") == true){
                    $('form input[type="submit"]').prop("disabled", false);
                }
                else if($(this).prop("checked") == false){
                    $('form input[type="submit"]').prop("disabled", true);
                }
            });
        });
    </script>

1
2017-08-02 10:26



Saya menggunakan jawaban @gnarf dan menambahkannya sebagai fungsi

   $.fn.disabled = function (isDisabled) {
     if (isDisabled) {
       this.attr('disabled', 'disabled');
     } else {
       this.removeAttr('disabled');
     }
   };

Kemudian gunakan seperti ini

$('#myElement').disable(true);

0
2017-11-16 10:24