Выборка Элементов Форм с jQuery

jQuery предлагает несколько псевдоселекторов, которые помогают выбрать элементы в формах. Они особенно полезны, потому что может быть трудно различить элементы формы на основе их состояния или типа, используя стандартные селекторы CSS.

:button

Использование псевдоселектора :button предназначается для любых элементов <button> и элементов с type="button":

$( "form :button" );

Чтобы получить наилучшую производительность при использовании :button, лучше сначала выбирать элементы обычным селектором jQuery, а затем использовать .filter( ":button" ). Другой вариант - указать перед псевдоселектором имя тега или некоторый другой селектор.

:checkbox

Использование псевдоселектора :checkbox предназначается для любого элемента <input> с type="checkbox":

$( "form :checkbox" );

Как и в случае с псевдоселектором :button, лучше сначала выбирать элементы обычным селектором jQuery, а затем использовать .filter( ":checkbox" ), или указать перед псевдоселектором некоторый другой селектор.

:checked

Не путайте с :checkbox, :checked выбирает только отмеченные флажки, так же как и включенные переключатели:

$( "form :checked" );

Псевдоселектор :checked работает, когда используется с флажками и переключателями.

:disabled

Использование псевдоселектора :disabled предназначается для любого элемента <input> с атрибутом disabled:

$( "form :disabled" );

Чтобы получить лучшую производительность при использовании :disabled, сначала выберите элементы обычным селектором jQuery, а затем используйте .filter( ":disabled" ), или укажите перед псевдоселектором имя тега или некоторый другой селектор.

:enabled

В основном инверсия псевдоселектора :disabled, псевдоселектор :enabled предназначается для любых элементов, у которых нет атрибута disabled:

$( "form :enabled" );

Чтобы получить лучшую производительность при использовании :enabled, сначала выберите элементы обычным селектором jQuery, затем используйте .filter( ":enabled" ), или укажите перед псевдоселектором имя тега или некоторый другой селектор.

:file

Использование псевдоселектора :file предназначается для любых элементов <input>, у которых есть type="file":

$( "form :file" );

Чтобы получить наилучшую производительность при использовании :file, сначала выберите элементы обычным селектором jQuery, затем используйте .filter( ":file" ), или укажите перед псевдоселектором имя тега или некоторый другой селектор.

Примечание: Для лучшей производительности в современных браузерах используйте [type="file"] вместо псевдоселектора :file.

:image

Использование псевдоселектора :image предназначается для любых элементов <input>, у которых есть type="image":

$( "form :image" );

Чтобы получить наилучшую производительность при использовании :image, сначала выберите элементы обычным селектором jQuery, затем используйте .filter( ":image" ), или укажите перед псевдоселектором имя тега или некоторый другой селектор.

Примечание: Для лучшей производительности в современных браузерах используйте [type="image"] вместо псевдоселектора :image.

:input

Использование селектора :input выбирает все элементы <input>, <textarea>, <select> и <button> :

$( "form :input" );

:password

Использование псевдоселектора :password предназначается для любых элементов <input> с type="password":

$( "form :password" );

Чтобы получить наилучшую производительность при использовании :password, сначала выберите элементы обычным селектором jQuery, затем используйте .filter( ":password" ), или укажите перед псевдоселектором имя тега или некоторый другой селектор.

Примечание: Для лучшей производительности в современных браузерах используйте [type="password"] вместо псевдоселектора :password.

:radio

Использование псевдоселектора :radio предназначается для любых элементов <input>, у которых есть type="radio":

$( "form :radio" );

Чтобы выбрать ряд ассоциированных переключателей, используйте:

// Выбрать все переключатели атрибутом name равным gender
$( "form input[name='gender']:radio" );

Чтобы получить наилучшую производительность при использовании :radio, сначала выберите элементы обычным селектором jQuery, затем используйте .filter( ":radio" ), или укажите перед псевдоселектором имя тега или некоторый другой селектор.

Примечание: Для лучшей производительности в современных браузерах используйте [type="radio"] вместо псевдоселектора :radio.

:reset

Использование псевдоселектора :reset предназначается для любых элементы <input>, у которых есть type="reset":

$( "form :reset" );

Чтобы получить наилучшую производительность при использовании :reset, сначала выберите элементы обычным селектором jQuery, затем используйте .filter( ":reset" ), или укажите перед псевдоселектором имя тега или некоторый другой селектор.

Примечание: Для лучшей производительности в современных браузерах используйте [type="reset"] вместо псевдоселектора :reset.

:selected

Использование псевдоселектора :selected предназначается для любых выбранных элементов <option>:

$( "form :selected" );

Чтобы получить наилучшую производительность при использовании :selected, сначала выберите элементы обычным селектором jQuery, затем используйте .filter( ":selected" ), или укажите перед псевдоселектором имя тега или некоторый другой селектор.

:submit

Использование псевдоселектора :submit предназначается для любых элементов <button> или <input> с type="button":

$( "form :submit" );

Селектор :submit обычно применяется к элементам <button> или <input>. Некоторые браузеры (такие как Internet Explorer) автоматически не задают элементу <button> тип type="submit" по умолчанию.

Примечание: Для лучшей производительности в современных браузерах используйте [type="submit"] вместо псевдоселектора :submit.

:text

Использование псевдоселектора :text предназначается для любых элементов <input> с type="text":

$( "form :text" );

Чтобы получить наилучшую производительность при использовании :text, сначала выберите элементы обычным селектором jQuery, затем используйте .filter( ":text" ), или укажите перед псевдоселектором имя тега или некоторый другой селектор.

Примечание: С jQuery 1.5.2 :text выбирает элементы <input>, у которых нет никакого указанного атрибута типа. Так что, type="text" подразумевается.

Далее: Как я выбираю элемент по ID, который имеет символы, используемые в нотации CSS?