javascript ] 버튼 클릭시 1회만 사용 후 새로운 함수로 변경

보통 많이 사용하고 있는 함수를 사용하는 방식은 함수안에 조건문을 통해 조건에 부합하는가에 따라 어떤 기능을 사용하고 사용하지 않는지를 구분할 것이다.

 

이번엔 색다른 방법을 소개하는 포스팅을 하겠다.

 

바로 아래의 예제소스를 확인해보자.

<button id="button" onclick="buttonEvent();" > 버튼 </button>

<script type="text/javascript">

    $(function () {
        
        $('#buttonEvent').click(function() {
            alert("아이디 클릭 이벤트");
            
        
        });
        
    }


    function buttonEvent() {
        alert("온클릭 이벤트");
        
        $('#button').attr({
           onclick: "",
           id: "buttonEvent"
        });
    }



</script>

 

위 코드를 보고 상상을 해서 소스를 실행시켜보자.

 

먼저 처음 버튼을 클릭하게 되면 온클릭 이벤트가 실행되면서 attr함수를 통해 온클릭의 값을 비워주고 id 값을 buttonEvent로 변경하였다.

 

이렇게 되면 그다음 버튼을 실행 하였을 경우엔 온클릭 함수가 아닌 buttonEvent 아이디 클릭 이벤트 함수가 실행 될 것이다.