jQuery функция .val()

Раздел: Работа с формой

Описание: Получить текущее значение элемента или установить значение соответствующего элемента input, textarea, checkbox, radio, select.

.val() - метод используется главным образом для получения или установки значений элементов формы. При вызове на несуществующий элемент она вернет undefined.

Получение и установка значений input[type="text"] или textarea

html:
<input name="textfield" type="text" id="textfield" value="Исходное значение">
javascript:
 // Получаем значение #textfield
 var txt = $("#textfield").val();
 // Устанавливаем значение #textfield
 var newTxt = 'value';
 $("#textfield").val(newTxt);

Для получения значений select, необходимо использовать селекторы :selected

html:
<select name="select" id="select">
 <option value="1" selected>Значение 1</option>
 <option value="2">Значение 2</option>
 <option value="3">Значение 3</option>
</select>

Получить значение выбранного элемента #select

javascript:
 $("#select option:selected").val();
 $("#select :selected").val();
 $("select#select").val();

Перебрать все элементы списка

javascript:
 $('#select option').each(function(){
 	var val = $(this).val();
 });

Сделать выбранным элемент select с значением 2

javascript:
 $("#select [value='2']").attr("selected", true);
 // или
 $("#select [value='2']").prop("selected", true);

Получить значение radio :checked

html:
<div id="radio">
 <input name="radio" type="radio" value="radio1">
 <input name="radio" type="radio" value="radio2">
 <input name="radio" type="radio" value="radio3" checked>
 <input name="radio" type="radio" value="radio4">
 <input name="radio" type="radio" value="radio5">
</div>
javascript:
 // по имени 
 $("input[type=radio][name=radio]:checked" ).val();
 // по ID блока
 $("#radio input:checked" ).val(); 

Получить значение checkbox :checked

html:
	<input type="checkbox" name="checkbox" id="checkbox" value="value" />
javascript:
 var val = $("input#checkbox:checkbox:checked").val();
 var val2 = $('#checkbox:checked').val();

Если флажок не установлен .val() вернет undefined

Рекомендуется делать проверку отмечен ли флажок с помощью .prop()

javascript:
var val = $('#checkbox').prop('checked') ? $('#checkbox').val() : 0 ;

Установить флажок отмеченным

javascript:
 $('#checkbox').prop('checked', true);

«Поделиться»

Комментарии - 0

Добавить комментарий