2015. 5. 6. 23:42ㆍplming/jQuery
사용자가 사용할 컨트롤만 사용하도록 보여지게하고
당장 사용하지 않는 컨트롤들은 보이지 않도록 하는
사용성을 좋게하려할 때 점진적인 공개(progressive disclosure) 원칙을 적용
체크박스가 label 엘리먼트에 포함되도록 함으로써
텍스트를 클릭해도 체크박스 컨트롤을 클릭한 것과 동일하게
컨트롤의 선택 상태를 변경하여 사용성을 높여준다.
<label>
<input type="checkbox" name="appetizers" value="imperial"/>
Fried Imperial rolls (2)
</label>
CSS를 사용하여 엘리먼트를 감출수도 있지만,
$('fieldset div div').hide();
스크립트를 사용하면 페이지를 로드할 때 부하가 좀 더 걸리긴 하지만
스크립트 사용 옵션을 꺼두는 사용자에게도 유용한 인터페이스를 제공할 수 있다...?
$('div', $(this).parents('div:first'))
this 엘리먼트의 조상에서 첫번째로 나오는 div 엘리먼트에 포함된 div를 찾아라
$('input[type=text]', $(this).parents('div:first'))
this 엘리먼트의 조상에서 첫번째로 나오는 div 엘리먼트에 포함된 type이 text인 input을 찾아라
가정하고 작성한 코드는
가정이 바뀌면 오작동하거나 오류가 발생하기 쉬우므로
명확하게 상태를 확인할 수 있는 엘리먼트의 경우에는 개별 상태에 맞춰 명확하게 작성하는 것이 좋다.
오페라나 인터넷익스플로러와 같은 브라우저에서는
비활성 상태의 필드에 color값을 재정의할 수 없다.
엘리먼트의 참조를 얻으려면 each() 메서드를 사용
'plming > jQuery' 카테고리의 다른 글
다른 라이브러리와 jQuery 사용하기 (0) | 2015.05.07 |
---|---|
유틸리티 함수 - 플래그 사용하기 (0) | 2015.05.07 |
jQuery 이벤트 모델 (0) | 2015.05.05 |
인터넷 익스플로러 이벤트 모델 (0) | 2015.05.04 |
DOM 레벨2 이벤트 모델 (0) | 2015.05.03 |