Метод val

Метод val позволява получаване и промяна на текущата стойност на елемент.

Синтаксис

Така можем да получим текущата стойност на първия елемент в набора:

javascript$(селектор).val();

Метод val се използва главно за получаване на стойности на елементи на формуляри, като: input, select и textarea. Ако се извика на празна колекция, ще върне undefined. При работа с select със зададен атрибут multiple, методът ще върне масив от стойности на всеки избран option. Ако никой от тях не е избран, ще се върне празен масив. Така можем да зададем стойността на всеки елемент в набора. Като параметър може да се подава низ, масив или число:

javascript$(селектор).val(стойност);

Прилагане на функция към всеки елемент в набора. Функцията приема като първи параметър текущия номер в набора, а като втори - неговата текуща стойност:

javascript$(селектор).val(име на атрибут, function(номер в набора, текуща стойност));

Пример

В следващия пример нека получим стойностите, въвеждани в полето, и ги изведем по-долу в параграф:

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();

Пример

А сега с помощта на метода val ще записваме стойностите на бутоните, които ще натискаме, в полето по-долу:

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);
});

Вижте също