검색결과 리스트
글
input 요소 선택
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>jQuery Element Selection</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script>
$(function() {
$("button").on("click", function() {
// 체크되어 있는 요소를 모두 선택함.
$(":checked").next().text("체크되어 있는 요소는 이 요소입니다.");
});
});
</script>
</head>
<body>
<h1>Form 요소의 선택</h1>
<form>
<input type="checkbox" name="lecture" value="html"> <span>HTML</span> <br>
<input type="checkbox" name="lecture" value="css"> <span>CSS</span> <br>
<input type="checkbox" name="lecture" value="javascript"> <span>자바스크립트</span> <br>
<input type="checkbox" name="lecture" value="jquery" checked> <span>제이쿼리</span>
</form>
<button>필터링</button>
</body>
</html>
위 소스에서 버튼을 클릭하면 체크 되어 있는 문항들의 텍스트가 변경 된다
선택자 | 설명 |
---|---|
:button | type 속성값이 "button"인 요소를 모두 선택함. |
:checkbox | type 속성값이 "checkbox"인 요소를 모두 선택함. |
:file | type 속성값이 "file"인 요소를 모두 선택함. |
:image | type 속성값이 "image"인 요소를 모두 선택함. |
:password | type 속성값이 "password"인 요소를 모두 선택함. |
:radio | type 속성값이 "radio"인 요소를 모두 선택함. |
:reset | type 속성값이 "reset"인 요소를 모두 선택함. |
:submit | type 속성값이 "submit"인 요소를 모두 선택함. |
:text | type 속성값이 "text"인 요소를 모두 선택함. |
:input | <input>, <textarea>, <select>, <button>요소를 모두 선택함. |
:checked | type 속성값이 "checkbox" 또는 "radio"인 요소 중에서 체크되어 있는 요소를 모두 선택함. |
:selected | <option>요소 중에서 선택된 요소를 모두 선택함. |
:focus | 현재 포커스가 가지고 있는 요소를 선택함. |
:disabled | 비활성화되어있는 요소를 모두 선택함. |
:enabled | 활성화되어있는 요소를 모두 선택함. |
출처 tcp스쿨
'개발 > jQuery' 카테고리의 다른 글
input 붙여 넣기 방지 (0) | 2017.10.17 |
---|---|
대표적인 getter 메소드와 setter 메소드 (0) | 2017.07.12 |
jQuery 선택자 (0) | 2017.07.12 |
비슷한 ID 가져오기 (0) | 2017.07.07 |
jQuery - select box 선택값 가져오기 (0) | 2017.01.18 |