Jquery div 클래스를 Onclick div로 내부 div에서 클릭하면 표시

Question

'See me'를 클릭하면 'see me see'라고 표시됩니다.
나는 이것을 $ ('div')로 할 수있다. ... 클릭하면 잘 작동한다. 하지만 컨테이너 div를 사용하는 것이 더 바람직하다고 생각합니다. 전체 페이지가 긴 페이지이고 함수가 onclick에 대해 div를 사용하면 클릭 만하면 실행됩니다.

<div class="directFilter"> 
    <div class="boxWithRightArrow seeMe">See me</div> 
    <div class="boldFont filterHeader">Sort By</div> 
    <div class="boxWithRightArrow borderTop bestClick">Best click</div> 
    <div class="boxWithRightArrow intermediateTime">Intermediate time</div> 
    <div class="boxWithRightArrow shortestTime">Shortest time</div> 
    <div class="boxWithRightArrow iPreferred">I preferred</div> 
</div> 


$('.directFilter').click(function() { 

     alert($(this).attr('class')); //alerts directFilter 

      if ($(this).hasClass("seeMe")) { 
       alert("see me"); 
      } else if ($(this).hasClass("bestClick")) { 
       alert("b click"); 
      } else if ($(this).hasClass("intermediateTime")) { 
       alert("itime"); 
      } else if ($(this).hasClass("shortestTime")) { 
       alert("s time"); 
      } else if ($(this).hasClass("iPreferred")) { 
       alert("i pre"); 
      } 
} 
    ); 

JsFiddle : http://jsfiddle.net/smilyface/e2L7s/

어떤 제안?

Answer 1

event.target을 사용하여 이벤트 소스를 식별 할 수 있습니다. 요소의 내부 내용을 가져 오려면 $(event.target).html() 또는 $(event.target).text()과 같은 html() 또는 text()를 사용해야합니다.

$('.directFilter').click(function(event) { 
     alert($(event.target).html()); //alerts directFilter 
}); 

당신이 다음 조건에서 소스 개체 식별로 event.target 사용할 필요가있는 경우 각에서 할 수있는 유일한 일이있는 경우

Live Demo.

Answer 2

$(document).on('click',function(e) { 
    // use this if you want limit clicks in .directFilter only 
    // $(document).on('click','.directFilter',function(e) 

    $this = $(e.target); 
    alert($this.text()) 
}); 

Answer 3

http://jsfiddle.net/prollygeek/e2L7s/7/

$('.directFilter').children().click(function() { 

     // alert($(this).attr('class')); //alerts directFilter 

      if ($(this).hasClass("seeMe")) { 
       alert("see me"); 
      } else if ($(this).hasClass("bestClick")) { 
       alert("b click"); 
      } else if ($(this).hasClass("intermediateTime")) { 
       alert("itime"); 
      } else if ($(this).hasClass("shortestTime")) { 
       alert("s time"); 
      } else if ($(this).hasClass("iPreferred")) { 
       alert("i pre"); 
      } 
} 
    ); 

많은 IF를를 사용하는 이유는 무엇입니까?!

Answer 4

팀,

가장 좋은 방법은

?

http://jsfiddle.net/smilyface/e2L7s/18/

$('.directFilter').click(function(event) { 
     if($(event.target).... 

http://jsfiddle.net/prollygeek/e2L7s/7/

$('.directFilter').children().click(function() { 
if ($(this)....