TIL(2일차)

김규현·2022년 8월 30일

Input box에 포커싱하기


웹페이지가 로딩되는 순간 입력해야하는 폼의 첫번 째 인풋 박스에 포커싱을 하기 위해서는 아래와 같이 script가 시작될 때 $(document).ready(function) 함수를 입력하고 포커싱을 하고 싶은 곳에 id값을 jquery 형식으로 입력해서 .focus()를 해주면 웹페이지가 로딩이 되자마자 해당 값이 위치하는 곳에 포커스 효과를 얻을 수 있다.

<script>
$(document).ready(function () {
        $("#name").focus();
    });
</script>    

<script>
if (name == ''){
            alert('이름 입력')
            $("#name").focus()
            return
        } else if (age == ''){
            alert('나이를 입력하세요!')
            $("#age").focus()
            return
</script>            

그리고 if문을 사용하여 값이 비어있다면 알럿창이 뜨고 해당 위치에 포커스를 맞출 수도 있다.
그 외 blur 사용자가 다른 곳을 클릭하거나 Tab 키를 눌러 다음 폼 필드로 이동하면 포커스 상태의 요소가 포커스를 잃게 된다.

profile
웹개발 회고록

0개의 댓글