Metoda val
Metoda val pozwala pobierać i zmieniać
aktualną wartość elementu.
Składnia
W ten sposób możemy pobrać aktualną wartość pierwszego elementu w zestawie:
$(selektor).val();
Metoda val jest głównie używana do
pobierania wartości elementów formularza, takich jak:
input,
select
i textarea. Jeśli
zostanie wywołana na pustej kolekcji, zwróci undefined.
Podczas pracy z select z ustawionym atrybutem
multiple, metoda zwróci tablicę wartości każdego
wybranego option. Jeśli żaden z nich nie jest wybrany,
zwrócona zostanie pusta tablica. W ten sposób możemy ustawić
wartość każdego elementu w zestawie. Jako parametr można
przekazać ciąg znaków, tablicę lub liczbę:
$(selektor).val(wartość);
Zastosowanie funkcji do każdego elementu w zestawie. Funkcja przyjmuje jako pierwszy parametr aktualny numer w zestawie, a jako drugi - jego aktualną wartość:
$(selektor).val(nazwa atrybutu, function(numer w zestawie, aktualna wartość));
Przykład
W następnym przykładzie pobierzmy wartości wprowadzane do inputa i wypiszmy je poniżej w akapicie:
<input type="text" value="text">
<p></p>
p {
color: green;
margin: 8px;
}
$('input').keyup(function() {
let value = $(this).val();
$('p').text(value);
}).keyup();
Przykład
A teraz za pomocą metody val będziemy
zapisywać wartości przycisków, które będziemy
klikać, w znajdującym się poniżej inputcie:
<div>
<button>one</button>
<button>two</button>
<button>three</button>
<button>four</button>
</div>
<input type="text" value="click buttons">
button {
margin: 4px;
cursor: pointer;
}
input {
margin: 4px;
color: green;
}
$('button').click(function() {
let text = $(this).text();
$('input').val(text);
});
