Метод val
Метод val элементнинг жорий қийматини олиш ва
ўзгартириш имконини беради.
Синтаксис
Топламдаги биринчи элементнинг жорий қийматини шундай оламиз:
$(селектор).val();
Метод val асосан форма элементларининг қийматларини
олиш учун ишлатилади, масалан:
input,
select
ва textarea. Агар
у бош топламда чақирилса, undefined қайтаради.
multiple атрибути ўрнатилган select билан ишлашда,
усул танланган ҳар бир optionнинг қийматлари массивини қайтаради. Агар уларнинг
ҳеч бири танланмаган бўлса, бош массив қайтарилади. Топламдаги
ҳар бир элементнинг қийматини шундай ўрнатамиз. Параметр сифатида
сатр, массив ёки рақам ўтказиш мумкин:
$(селектор).val(қиймат);
Топламдаги ҳар бир элементга функцияни қўллаш. Функция биринчи параметр сифатида топламдаги жорий рақамни, икинчиси эса унинг жорий қийматини қабул қилади:
$(селектор).val(атрибут номи, function(топламдаги рақам, жорий қиймат));
Мисол
Кейинги мисолда инпутга киритилаётган қийматларни олиб, уларни қуйидаги абзацга чиқарамиз:
<input type="text" value="text">
<p></p>
p {
color: green;
margin: 8px;
}
$('input').keyup(function() {
let value = $(this).val();
$('p').text(value);
}).keyup();
Мисол
Энди эса val методу ёрдамида биз босайотган
туғмачаларнинг қийматларини қуйида жойлашган инпутга
ёзамиз:
<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);
});