nonaktifkan semua elemen bentuk di dalam div

161

apakah ada cara untuk menonaktifkan semua bidang (textarea / textfield / option / input / checkbox / submit dll) dalam formulir dengan mengatakan hanya nama div induk di jquery / javascript?

— amirash
sumber

4

Perhatikan bahwa dengan melakukan ini, Anda menyebabkan nilai elemen-elemen itu "menghilang" ketika mengirimkan formulir - untuk mempertahankan nilai membuatnya readOnly, bukan dinonaktifkan.

— Shadow Wizard adalah Ear For You

kemungkinan rangkap dari Cara menonaktifkan semua konten div

— Michel Ayres

1

Sebuah Ide dapat berupa sembunyikan / tampilkan div di depan kontrol yang diizinkan / dicegah diklik, plus kontrol gaya nonaktif dengan css.

— Jaider

261

Coba gunakan :inputpemilih, bersama dengan pemilih induk:

$("#parent-selector :input").attr("disabled", true);

— Andrew Whitaker
sumber

dapatkah saya menggunakan ini untuk mengatur semua input di dalam div ke nilai 0?

— jackson5

2

Saya ingin menonaktifkan <a> juga ... <a> saya juga memiliki klik

— RAJ

7

Mengutip jQuery : Karena: input adalah ekstensi jQuery dan bukan bagian dari spesifikasi CSS, permintaan menggunakan: input tidak dapat memanfaatkan peningkatan kinerja yang disediakan oleh metode DOM querySelectorAll () asli. Untuk mencapai kinerja terbaik saat menggunakan: input untuk memilih elemen, pertama pilih elemen menggunakan pemilih CSS murni, kemudian gunakan .filter (": input").

— acme

2

@acme: Setuju 100% tetapi pertanyaannya tidak memberikan petunjuk apa pun untuk pemilih yang bisa saya filter. Satu-satunya informasi yang diberikan kepada saya adalah bahwa pengguna harus dapat melakukannya dengan nama indukdiv dan hanya itu. Jika diberi informasi lebih lanjut, saya bisa mendapatkan solusi yang lebih efisien.

— Andrew Whitaker

1

Gunakan .prop () alih-alih .attr () (di atas jquery 1.6)

— Akshay Gundewar

154

$('#mydiv').find('input, textarea, button, select').attr('disabled','disabled');

— Trevor
sumber

4

seharusnya ('input, textarea, button') semua penyeleksi harus dikutip dengan satu set kutipan. api.jquery.com/multiple-selector Melakukannya dengan cara Anda mengirim banyak argumen.

— Ivan Ivanić

2

Ini hanya akan menemukan Anda input, mengabaikan area dan tombol teks. Selector input adalah cara untuk melakukannya, tetapi jika Anda ingin membuat daftar secara eksplisit, Anda harus menggunakannya $('#mydiv').find('input, textarea, button').

— Mark Hildreth

1

... atau hanya $ ('# formulir Anda'). children (). prop ('dinonaktifkan', true);

— walv

@walv kode Anda hanya berfungsi jika semua elemen formulir merupakan turunan tunggal dari formulir. Find () menemukan semua elemen dalam daftar terlepas dari level turunan. Baris kode ini benar selain menggunakan prop bukan attr untuk versi jquery baru.

— Chris O

32

Untuk jquery 1.6+, gunakan .prop()sebagai ganti .attr(),

$("#parent-selector :input").prop("disabled", true);

atau

$("#parent-selector :input").attr("disabled", "disabled");

— Optimus prime
sumber

2

Anda benar tetapi beberapa waktu menopang kerja dan beberapa waktu tidak bekerja, khususnya karena kotak centang dan radiobutton

— damon

saya menyadari bahwa ini adalah utas lama, tetapi ini menendang beberapa kesalahan saat menggunakan naskah

— Simon Price

5

    $(document).ready(function () {
        $('#chkDisableEnableElements').change(function () {
            if ($('#chkDisableEnableElements').is(':checked')) {
                enableElements($('#divDifferentElements').children());
            }
            else {
                disableElements($('#divDifferentElements').children());
            }
        });
    });

    function disableElements(el) {
        for (var i = 0; i < el.length; i++) {
            el[i].disabled = true;

            disableElements(el[i].children);
        }
    }

    function enableElements(el) {
        for (var i = 0; i < el.length; i++) {
            el[i].disabled = false;

            enableElements(el[i].children);
        }
    }

— Syed Nasir Abbas
sumber

4

Sederhananya baris kode ini akan menonaktifkan semua elemen input

$('#yourdiv *').prop('disabled', true);

— Samir Rahimy
sumber

jawaban terbaik dari pendapat saya.

— Ajay2707

2

Bagaimana dengan mencapai ini hanya menggunakan atribut HTML 'dinonaktifkan'

<form>
 <fieldset disabled>
  <div class="row">
   <input type="text" placeholder="">
   <textarea></textarea>
   <select></select>
  </div>
  <div class="pull-right">
    <button class="button-primary btn-sm" type="submit">Submit</button>
  </div>
 </fieldset>
</form>

Hanya dengan menonaktifkannya di set field, semua bidang di dalam setset tersebut akan dinonaktifkan.

$('fieldset').attr('disabled', 'disabled');

— طلحة
sumber

1

Saya menggunakan fungsi di bawah ini di berbagai titik. Bekerja dalam elemen div atau tombol dalam sebuah tabel selama pemilih kanan digunakan. Hanya ": tombol" tidak akan mengaktifkan kembali untuk saya.

function ToggleMenuButtons(bActivate) {
    if (bActivate == true) {
        $("#SelectorId :input[type='button']").prop("disabled", true);
    } else {
        $("#SelectorId :input[type='button']").removeProp("disabled");
    }
}

— AWizardInDallas
sumber

solusi dua dalam satu yang bagus.

— 3 aturan

0

Mengikuti akan menonaktifkan semua input tetapi tidak akan mampu untuk btn kelas dan juga menambahkan kelas untuk menimpa menonaktifkan css.

$('#EditForm :input').not('.btn').attr("disabled", true).addClass('disabledClass');

kelas css

.disabledClass{
  background-color: rgb(235, 235, 228) !important;
}

— Rohit Dubey
sumber

0

Bagi saya jawaban yang diterima tidak berfungsi karena saya memiliki beberapa bidang tersembunyi asp net yang dinonaktifkan juga jadi saya memilih hanya untuk menonaktifkan bidang yang terlihat

//just to save the list so we can enable fields later
var list = [];
$('#parent-selector').find(':input:visible:not([readonly][disabled]),button').each(function () {
    list.push('#' + this.id);
});

$(list.join(',')).attr('readonly', true);

— irfandar
sumber

0

Gunakan Kelas CSS untuk mencegah dari Mengedit Elemen Div

CSS:

.divoverlay
{
position:absolute;
width:100%;
height:100%;
background-color:transparent;
z-index:1;
top:0;
}

JS:

$('#divName').append('<div class=divoverlay></div>');

Atau tambahkan nama kelas dalam Tag HTML. Ini akan mencegah dari mengedit Elemen Div.

— Laddu Vasanth
sumber

0

Hanya tipe teks

$(".form-edit-account :input[type=text]").attr("disabled", "disabled");

Hanya tipe kata sandi

$(".form-edit-account :input[type=password]").attr("disabled", "disabled");

Hanya Jenis Email

$(".form-edit-account :input[type=email]").attr("disabled", "disabled");

— Manish
sumber