Metoda val

Metoda val umožňuje získat a změnit aktuální hodnotu prvku.

Syntaxe

Tímto způsobem můžeme získat aktuální hodnotu prvního prvku v sadě:

javascript$(selektor).val();

Metoda val se používá především k získávání hodnot prvků formuláře, jako jsou: input, select a textarea. Pokud je volána na prázdné kolekci, vrátí undefined. Při práci s select s nastaveným atributem multiple, metoda vrátí pole hodnot každé vybrané option. Pokud není vybrána žádná, vrátí se prázdné pole. Tímto způsobem můžeme nastavit hodnotu každého prvku v sadě. Jako parametr lze předat řetězec, pole nebo číslo:

javascript$(selektor).val(hodnota);

Aplikace funkce na každý prvek v sadě. Funkce přijímá jako první parametr aktuální index v sadě a jako druhý - jeho aktuální hodnotu:

javascript$(selektor).val(název atributu, function(index v sadě, aktuální hodnota));

Příklad

V následujícím příkladu získáme hodnoty zadané do vstupního pole a vypíšeme je níže do odstavce:

html<input type="text" value="text">
<p></p>

cssp {
  color: green;
  margin: 8px;
}

javascript$('input').keyup(function() {
  let value = $(this).val();
  $('p').text(value);
}).keyup();

Příklad

A nyní pomocí metody val budeme zapisovat hodnoty tlačítek, která budeme stlačovat, do níže umístěného vstupního pole:

html<div>
  <button>one</button>
  <button>two</button>
  <button>three</button>
  <button>four</button>
</div>
<input type="text" value="click buttons">

cssbutton {
  margin: 4px;
  cursor: pointer;
}

input {
  margin: 4px;
  color: green;
}

javascript$('button').click(function() {
  let text = $(this).text();
  $('input').val(text);
});

Viz také