Выборка Элементов Форм с 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?