Metode val
Metode val memungkinkan untuk mendapatkan dan mengubah
nilai saat ini dari sebuah elemen.
Sintaks
Berikut adalah cara untuk mendapatkan nilai saat ini dari elemen pertama dalam kumpulan:
$(selektor).val();
Metode val terutama digunakan untuk
mendapatkan nilai dari elemen formulir, seperti:
input,
select
dan textarea. Jika
dipanggil pada kumpulan kosong, akan mengembalikan undefined.
Saat bekerja dengan select yang memiliki atribut
multiple yang diatur, metode akan mengembalikan array nilai dari setiap
option yang dipilih. Jika tidak ada yang dipilih,
maka akan dikembalikan array kosong. Berikut adalah cara untuk menetapkan
nilai setiap elemen dalam kumpulan. Sebagai parameter dapat
diteruskan string, array, atau angka:
$(selektor).val(nilai);
Menerapkan fungsi ke setiap elemen dalam kumpulan. Fungsi menerima parameter pertama sebagai indeks saat ini dalam kumpulan, dan parameter kedua - nilainya saat ini:
$(selektor).val(nama atribut, function(indeks dalam kumpulan, nilai saat ini));
Contoh
Dalam contoh berikut, mari kita dapatkan nilai yang dimasukkan ke dalam input, dan tampilkan di bawahnya dalam paragraf:
<input type="text" value="teks">
<p></p>
p {
color: green;
margin: 8px;
}
$('input').keyup(function() {
let value = $(this).val();
$('p').text(value);
}).keyup();
Contoh
Sekarang dengan metode val kita akan
mencatat nilai tombol yang ditekan
ke dalam input yang terletak di bawah:
<div>
<button>satu</button>
<button>dua</button>
<button>tiga</button>
<button>empat</button>
</div>
<input type="text" value="klik tombol">
button {
margin: 4px;
cursor: pointer;
}
input {
margin: 4px;
color: green;
}
$('button').click(function() {
let text = $(this).text();
$('input').val(text);
});
