JQuery, 서로 다른 태그를 하나의 click event에 바인딩 하기

---

JQuery Click Event

업무를 하다보면 어쩌다가 한 번씩은 서로다른 태그나 버튼으로 하나의 함수를 호출할 일이 생긴다.

이때 서로 다른 click event 한곳에서 처리 하기 위해서는 두 개의 서로 다른 id 나 class 를 한 이벤트로 명시해주면 된다.

아래 예시에서 두 개의 서로 다른 태그가 있고 각각 클래스가 추가되어 있다.

JQuery 소스에서 이벤트를 바인딩할 때 함께 명시해주면 깔끔하게 해결 된다.

페이지 소스

<div class="tag1" id="d1">test1</div>

<div class="tag2" id="d2">test2</div>

JQuery 소스

$('.tag1, .tag2').click(function() {  // 두 클래스에서 발생하는 click event 처리

    var $this = $(this); 

    if ($this.hasClass('tag1')) { 

        // tag1을 클릭한 경우 

    } else {

        // tag1이 아닌 다른 태그를 클릭한 경우 

    } 

});