Round Figure

[jquery] select box 선택값 가져오기 select box ID로 접근하여 선택된 값 읽기 $("#셀렉트박스ID option:selected").val(); select box Name로 접근하여 선택된 값 읽기 $("select[name=셀렉트박스name]").val(); 같은 방식으로 span과 같은 다른 태그도 접근 가능하다 $("span[name=셀렉트박스name]").text(); 선택된 값의 index를 불러오기 var index = $("#셀렉트박스ID option").index($("#셀렉트박스ID option:selected")); 셀렉트 박스에 option값 추가하기 $("#셀렉트박스ID").append("1번"); 셀렉트 박스 option의 맨앞에 추가 할 경우 $("#셀..

비밀번호 유효성검사 예시 function checkPassword(password){ if(!/^[a-zA-Z0-9]{8,16}$/.test(password)){ alert('숫자와 영문자 조합으로 8~16자리를 사용해야 합니다.'); return false; } var checkNum = password.search(/[0-9]/g); // 숫자사용 var checkEng = password.search(/[a-z]/ig); // 영문사용 if(checkNum

아이디나 비밀번호 유효성 검사할때 jQuery 정규식 표현을 사용하여 유효성을 검사 할 수 있다 자주쓰는 정규표현식 숫자만 입력 가능 : /[^0-9]$/ ^는 문자의 시작 부분에 대응하여 $는 끝 부분과 대응하여 숫자만 입력 했는지 검사할 수 있다 한글만 입력가능 : /[^가-힣]$/ 영어만 입력 가능 : /[^a-zA-Z]$/ a-z는 소문자 A-Z는 대문자를 의미하며 소문자와 대문자만 있는지 검사할 수 있다 아이디 유효성 검사 예시 function fn_validateId(str) { var id = str; //특수문자가 있는지 확인 var spe = id.search(/[`~!@@#$%^&*|₩₩₩'₩";:₩/?]/gi); // 한글이 있는지 확인 var korean = id.search(/[ㄱ..

JSTL(JSP Standard Tag Library) 커스텀 태그 중 자주 사용되는 태그를 모아 표준화한 라이브러리 커스텀 태그: JSP에서 필요에 따라 새로운 태그를 추가할 수 있는 기능 태그라이브러리 별 선언문 - 기능사용을 위해 추가해야한다 1. Core (prefix : c) 일반 프로그래밍에서 제공하는 것과 유사한 변수선언 실행 흐름의 제어 기능을 제공 페이지 이동 기술 제공 2. Formatting (prefix : fmt) 숫자, 날짜, 시간을 포매팅하는 기능을 제공 국제화, 다국어 지원 기능 제공 3. DataBase (prefix : sql) DB의 데이터를 입력 / 수정 / 삭제 / 조회 하는 기능을 제공 4. XML (prefix : x) XML문서를 처리할 때 필요한 기능 제공 5..

텍스트가 아닌 콘테츠는 그 의미나 용도를 인식할 수 있도록 대체 텍스트를 제공해야 한다 1. img태그 등의 이미지 요소에 대해 alt속성을 제공하지않거나 alt속성을 선언되어있으나 그 내용이 img 내용을 대체할수 없으면 안된다 2. img태그 에 title만으로 대체 텍스트를 제공해서는 안된다 3. 이미지맵을 사용할 경우 대체 텍스트로 설명하고 순서가 잘 맞도록 작성하여야한다 4. 게시판에 콘텐츠를 등록 하는 것처럼 사용자가 직접 대체 텍스트가 필요한 콘텐츠를 등록할 때 해당 컨텐츠의 대체 텍스트를 제공해야 한다

스크린리더와 같은 통신 기기는 label 태그를 통해 input 태그를 인식한다 label 태그는 양식 입력 창의 요소들을 위한 캡션 명시적, 암시적 코드 작성 방법이 있다 주로 input 태그와 함께 사용 텍스트 label의 for 속성을 input의 id 속성으로 연결 명시적 작성 방식 텍스트 암시적 작성 방식 텍스트 두 방식 모두 사용하더라도 문제가 없는 것이 표준이지만 일부 통신 기기에서 암시적 방식을 지원하지 않기 때문에 명시적 방식을 사용하는 것이 좋다 디자인 상 label이 제공되기 어려운 경우는 input 태그에 title 속성을 사용 input의 placeholder의 경우 스크린리더에서 읽혀지는것을 보장할수 없으므로 title 속성도 사용

tabindex? 키보드의 Tab키를 눌렀을 때 포커스의 이동 순서를 임의로 조정할 수 있는 HTML의 속성 마크업 순서가 논리적으로 잘 구성되어 있다면 대체로 사용할 필요가 없지만 웹페이지를 구성할 때 디자인 요소 등 때문에 순서대로 배치되어 있지 않을 때 사용해 자연스럽게 페이지를 탐색할 수 있도록 구성한다 1. tabindex="1" 문서 안에서 가장 먼저 초점을 받을 수 있다 먼저 초점을 받기 때문에 사용 시 주의가 필요하다 2. tabindex="0" 키보드 초점을 받을 수 없는 div, span과 같은 요소도 초점을 받을 수 있도록 만들어 준다 초점 받는 순서는 마크업 순서를 따른다 2. tabindex="-1" 키보드 초점을 받을 수 있는 요소도 초점을 받을 수 없도록 한다