jQuery perlu menambahkan ke kolom input

171

Saya telah mencari cara agar jQuery secara otomatis menulis diperlukan menggunakan validasi html5 untuk semua bidang input saya, tetapi saya mengalami kesulitan menentukan di mana harus menulisnya.

Saya ingin mengambil ini

 <input type="text" name="first_name" value="" id="freeform_first_name"
 maxlength="150">

dan memilikinya secara otomatis menambahkan diperlukan sebelum tag penutup

 <input type="text" name="first_name" value="" id="freeform_first_name"
 maxlength="150" required>

Saya pikir saya bisa melakukan sesuatu di sepanjang garis

$("input").attr("required", "true");

Tapi itu tidak berhasil. Setiap bantuan sangat dihargai.

javascript jquery validation

— Miura-shi
sumber

2

Apakah tidak dibungkus dom siap? $(function(){....});

— PSL

Saya menggunakan jsfiddle.net/japaneselanguagefriend/LEZ4r

— Miura-shi

jika 'input' adalah id, jquery tidak memiliki # pada pemilih di sini.

— John Meyer

@JohnMeyer "input" adalah pemilih tag. Tidak perlu # jika menargetkan tag input

— Spartacus

420

$("input").prop('required',true);

DEMO FIDDLE

— Tidak dikenal
sumber

1

Hmm, menambahkan tombol kirim tetapi masih belum memvalidasi atau menambahkan atribut yang diperlukan ke kolom input. jsfiddle.net/japaneselanguagefriend/LEZ4r

— Miura-shi

1

@JohnMeyer "input" adalah pemilih tag

— morefromalan

1

mendapat TypeError: element.prop is not a functionkesalahan

— davideghz

@ Miura-shi Anda kehilangan <form></form>tag di jsFiddle Anda

— JESTech

Jika itu dapat membantu seseorang: ini pada awalnya tidak berhasil bagi saya karena saya memanggil .prop('required',true)input sebelum memanggilnya .css("display", "block").

— electrotype

52

Anda dapat melakukannya dengan menggunakan attr, kesalahan yang Anda buat adalah Anda memasukkan tanda kutip yang sebenarnya. alih-alih itu coba ini:

$("input").attr("required", true);

— Joz Naveen Joz
sumber

2

@JohnMeyer "input" adalah nama pemilih tag

— dave4jr

requiredadalah atribut boolean dan hanya boleh dihilangkan (untuk "false"), atau memiliki nilai yang sama dengan namanya (yaitu "required") untuk "true". Ini sebenarnya lebih baik digunakan .prop().

— Alnitak

@Alnitak Tidak jika Anda berupaya membuat situs yang kompatibel dengan IE, prop()tidak berfungsi di sana seperti halnya di browser modern. Masih lebih baik digunakan $(ele).attr("required", true)dan falsedihapus.

— Oliver Heward

29

Saya telah menemukan bahwa implementasi berikut ini efektif:

$('#freeform_first_name').removeAttr('required');

$('#freeform_first_name').attr('required', 'required');

Perintah-perintah ini (attr, removeAttr, prop) berperilaku berbeda tergantung pada versi JQuery yang Anda gunakan. Silakan rujuk dokumentasi di sini: https://api.jquery.com/attr/

— John Meyer
sumber

6

Menggunakan .attrmetode

.attr(attribute,value); // syntax

.attr("required", true);
// required="required"

.attr("required", false);
//

Menggunakan .prop

.prop(property,value) // syntax

.prop("required", true);
// required=""

.prop("required", false);
//

Baca lebih lanjut dari sini

https://stackoverflow.com/a/5876747/5413283

— Dexter
sumber

4

Saya menemukan bahwa jquery 1.11.1 tidak melakukan ini dengan andal.

Saya menggunakan $('#estimate').attr('required', true)dan $('#estimate').removeAttr('required').

Menghapus requiredtidak dapat diandalkan. Kadang-kadang akan meninggalkan requiredatribut tanpa nilai. Karena requiredattibute boolean, kehadirannya semata, tanpa nilai, dilihat oleh browser sebagai true.

Bug ini intermiten, dan saya bosan mengacaukannya. Beralih ke document.getElementById("estimate").required = truedan document.getElementById("estimate").required = false.

— Doris Gammenthaler
sumber

removeAttrtidak bekerja untuk saya. Lalu saya menggunakan solusi Anda dan berfungsi dengan baik. Terima kasih!

— Diego Somar

4

Seharusnya tidak menyertakan benar dengan "" kutipan ganda itu harus seperti

$(document).ready(function() {            
   $('input').attr('required', true);   
});

Anda juga dapat menggunakan prop

jQuery(document).ready(function() {            
   $('input').prop('required', true);   
});

Alih-alih benar Anda dapat mencoba diperlukan. Seperti

$('input').prop('required', 'required');

— Rokan Nashp
sumber