password 선택자
:password 선택자는
password 타입의 요소를 선택합니다.
비밀번호 입력 필드를 참고하세요.
$(':password')의 동등한 표현은
$('[type=password]')입니다.
:password는 CSS 사양에 속하지 않으므로,
현대 브라우저에서 성능을 향상시키기 위해
[type='password']를 사용하는 것이 더 좋습니다.
문법
password 타입의 필드를 다음과 같이 선택합니다:
$(':password');
다른 의사 클래스 선택자들(':'로 시작하는)과 마찬가지로,
':' 앞에 태그 이름이나 다른 선택자를 지정하는 것이 좋으며,
그렇지 않으면 '*' 선택자가 적용됩니다.
즉, $(':password')는
$('*:password')로 해석되므로,
대신 $('input:password')를 사용하는 것이 더 좋습니다.
예시
모든 password 타입의 입력 필드를 선택하고,
css 메서드를 사용하여
녹색 배경과 빨간색 테두리를 적용해 봅시다:
<form>
<input type="button" value="button">
<input type="file">
<input type="password">
<button>button</button>
<input type="reset">
<input type="radio" name="test">
<input type="radio" name="test">
<input type="checkbox">
<input type="text">
</form>
<+javascript+>
$('form input:password').css({background: 'green', border: '2px red solid'});
$('form').submit(function(event) {
event.preventDefault(); // 폼 제출 방지
});
<-javascript->