Selectorul input

Selectorul :input selectează elementele de control din formular - inputuri, textaree, liste drop-down și butoane. Vedeți tagurile: input, textarea, button, select. Deoarece :input nu face parte din specificația CSS, pentru a îmbunătăți performanța în browserele moderne este mai bine să filtrați mai întâi elementele cu utilizarea unui selector css pur, iar apoi să aplicați .filter(':input').

Sintaxă

Așa selectăm elementele de control din formular:

javascript$(':input');

Exemplu

Să selectăm, conform teoriei de mai sus, toate elementele de control din formular și să afișăm în consolă numărul lor, cu ajutorul proprietății length. Noi vom vedea că acolo vor fi incluse toate 13 taguri:

html<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>

csstextarea {
  height: 25px;
}

javascriptlet allInputs = $(':input');
console.log('Numărul de taguri: ' + allInputs.length);

$('form').submit(function(event) {
  event.preventDefault(); // prevenirea trimiterii formularului
});

Vedeți și