JQuery

Password change

청춘고양이 2022. 6. 17. 19:25
반응형

Password 한글 -> ****** 변경

타 웹사이트들을 들어가 보면 비밀번호 변경창 옆에 숨기기 표시로 클릭 시 *가 나오고 다시 누르면 사용자가 입력한 password를 표시하는 내용이 있다. ex) 비밀번호 입력란에 aaaaaa를 입력하고 숨기기를 누르면 ******로 바뀜.


HTML

   <div id="controll">
        <input type="password" placeholder="비밀번호를 입력하세요">
        <i class="encryption"></i>
      </div>

JQuery

    <script>
        $(document).ready(function(){
    $('#controll').on('click',function(){
        $('input').toggleClass('active');
        if($('input').hasClass('active')){
            $(this).attr('class',"encryption")
            .prev('input').attr('type',"text");
        }else{
            $(this).attr('class',"encryption")
            .prev('input').attr('type','password');
        }
    });
});

    </script>
반응형