비밀번호 보기/숨기기

 

 

로그인, 회원가입, 회원탈퇴 시 비밀번호 입력 란에 토글기능 추가

 

 

# jsp 코드 안에

 

1. 헤더 안에 코드 추가

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">

 

 

2. body의 비밀번호 input 아래줄에 코드 추가

<i class="fas fa-eye togglePassword"></i>

 

 

3. body 아래쪽에 script 추가

<!-- jQuery Library -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<!-- Custom Script -->
<script>
    $(document).ready(function () {
        $('.togglePassword').on('click', function () {
            var input = $(this).prev('input');
            var icon = $(this);
            if (input.attr('type') === 'password') {
                input.attr('type', 'text');
                icon.attr('class', 'fas fa-eye-slash togglePassword');
            } else {
                input.attr('type', 'password');
                icon.attr('class', 'fas fa-eye togglePassword');
            }
        });
    });
</script>