Селектор input - выбор элементов управления формы
Селектор :input
выбирает элементы управления
формы - инпуты, текстареа, выпадающие списки и
кнопки. Смотрите теги:
input
,
textarea
,
button
,
select
.
Так как :input
не относится к CSS спецификации,
то для улучшения производительности в современных
браузерах лучше в начале отфильтровать элементы с
использованием чистого css-селектора, а затем
применить .filter(':input')
.
Синтаксис
Так мы выбираем элементы управления формой:
$(':input');
Пример
Давайте, согласно приведенной выше теории,
выберем все элементы управления формой и выведем
в консоль их число, с помощью свойства
length
. Мы
увидим, что туда попали все 13
тегов:
<form>
<input type="button" value="button">
<input type="checkbox">
<input type="file">
<input type="hidden">
<input type="image">
<input type="password">
<input type="radio">
<input type="reset">
<input type="submit">
<input type="text">
<select>
<option>option</option>
</select>
<textarea></textarea>
<button>button</button>
</form>
textarea {
height: 25px;
}
let allInputs = $(':input');
console.log('Tags amount: ' + allInputs.length);
$('form').submit(function(event) {
event.preventDefault(); // предотвращает отправку формы
});