Bộ chọn input
Bộ chọn :input chọn các phần tử điều khiển
biểu mẫu - input, textarea, danh sách thả xuống và
nút bấm. Xem các thẻ:
input,
textarea,
button,
select.
Vì :input không thuộc đặc tả CSS,
nên để cải thiện hiệu suất trong các
trình duyệt hiện đại, tốt hơn là trước tiên lọc các phần tử với
việc sử dụng bộ chọn css thuần túy, sau đó
áp dụng .filter(':input').
Cú pháp
Chúng ta chọn các phần tử điều khiển biểu mẫu như sau:
$(':input');
Ví dụ
Hãy, theo lý thuyết đã nêu ở trên,
chọn tất cả các phần tử điều khiển biểu mẫu và xuất ra
console số lượng của chúng, với thuộc tính
length. Chúng ta
sẽ thấy rằng tất cả 13 thẻ đã được chọn:
<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('Số lượng thẻ: ' + allInputs.length);
$('form').submit(function(event) {
event.preventDefault(); // ngăn chặn việc gửi biểu mẫu
});