A val metódus
A val metódus lehetővé teszi elemek aktuális értékének
lekérését és módosítását.
Szintaxis
Így kérhetjük le a halmaz első elemének aktuális értékét:
$(selector).val();
A val metódust főleg űrlapelemek értékeinek lekérésére használják, mint például:
input,
select
és textarea. Ha
egy üres gyűjteményen hívjuk meg, akkor undefined értéket ad vissza.
A multiple attribútummal beállított select elemek esetén a metódus
minden kiválasztott option értékéből álló tömböt ad vissza. Ha egyik sem
van kiválasztva, akkor egy üres tömböt kapunk. Így állíthatjuk be a
halmaz minden elemének értékét. Paraméterként átadhatunk sztringet, tömböt vagy számot:
$(selector).val(érték);
Függvény alkalmazása a halmaz minden elemére. A függvény első paramétere a halmazbeli aktuális index, a második pedig az elem aktuális értéke:
$(selector).val(attribútum neve, function(index, aktuális érték));
Példa
A következő példában kérjük le az input mezőbe beírt értékeket, és jelenítsük meg azokat alább egy bekezdésben:
<input type="text" value="szöveg">
<p></p>
p {
color: green;
margin: 8px;
}
$('input').keyup(function() {
let value = $(this).val();
$('p').text(value);
}).keyup();
Példa
Most pedig a val metódus segítségével a megnyomott gombok
értékeit írjuk az alatta lévő input mezőbe:
<div>
<button>one</button>
<button>two</button>
<button>three</button>
<button>four</button>
</div>
<input type="text" value="kattints a gombokra">
button {
margin: 4px;
cursor: pointer;
}
input {
margin: 4px;
color: green;
}
$('button').click(function() {
let text = $(this).text();
$('input').val(text);
});