Selamat datang kembali di website tips dan trik Dumet School, berjumpa kembali dengan saya yang selalu memberikan tips dan trik seputar dunia website. Pada kesempatan kali ini saya akan memberikan tips dan trik tentang Mengenal Fungsi Attribute Selector Input Pada jQuery apa itu attribute selector input..??
Fungsi yang ada pada jQuery ini hampir sama dengan class css pada umumnya, dengan menggunakan class kita dapat merubah semua class yang sama. Beda nya dengan attribute selector input ini berfokus pada tag input saja dimana dengan menggunakan fungsi ini kita dapat membuat pilihan. Pada latihan kali ini kita akan membuat beberapa tag input html kemudian kita selector name nya lalu saya akan mengatur tag input tersebut berdasarkan huruf, dan huruf ini bisa kita letakkan 1,2,3 huruf atau seterusnya.
Baik langsung saja kita implementasikan Mengenal Fungsi Attribute Selector Input Pada jQuery seperti biasa siapkan text editornya. Kemudian ketikkan script html nya atau bisa copy di bawah ini
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title><strong>Mengenal Fungsi Attribute Selector Input Pada jQuery</strong></title> </head> <body> <input name="hernowo"> <input name="david"> <input name="fachrul"> <input name="fery"> <input name="robani"> </body> </html>
Kemudian save dengan nama index.html, selanjutnya kita berikan fungsi pada jQuery nya tentunya kita load terlebih dahulu library jQuery nya.
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
Kemudian tambahkan script di bawah ini
$( "input[name*='e']" ).css({"padding":"5px 10px","border":"1px solid red"}).attr('placeholder','isi disini');
Dengan script di atas ini jika di jalankan pada browsernya maka akan menghasilkan output seperti gambar di bawah ini
Lihat pada gambar di atas ini, yang memili border, padding dan placeholder berdasarkan huruf e saja, jika saya mengganti dengan 2 huruf
Maka yang akan di selector form input yang di dalam name nya terdapat huruf ro saja
Mengapa bisa di selector semua name dalam tag input
Karena terdapat simbol * yang berarti mengambil semua data, dengan begitu semua name yang ada di dalam tag input dapat di selector.
Sekian pada artikel kali ini tentang Mengenal Fungsi Attribute Selector Input Pada jQuery kita jumpa kembali pada tips dan trik yang akan datang. Terimakasih dan sampai jumpa.
Semoga bermanfaat
The post Mengenal Fungsi Attribute Selector Input Pada jQuery appeared first on Kursus Website Terbaik.