특정 클래스에 대한 확인 버튼 클릭

Question

$("div#buttonContainer ul li").live("click",function(){  
    if($(this).hasClass('selected')){ 
     alert('selected'); 
    }  
}); 

<div id="buttonContainer"> 
    <ul> 
     <li class="selected"></li> 
     <li></li> 
     <li></li> 
    </ul>  
</div> 

모든 li 태그에 적용되는 클릭 핸들러가 있습니다. 그러나 li에 선택한 클래스가있을 때 특정 함수를 실행하고 싶습니다. 위의 자바 스크립트는 클릭 한 모든 경고를 팝업합니다. 내가 뭘 잘못하고 있는지 모르겠다. 어쩌면 특정 li을 올바르게 타겟팅하지 않을 수도있다.

편집 : 나는 업그레이드 할 수

나는 JQuery와 1.3 기술을 사용해야합니다.

Answer 1

다른 포스터가 jsFiddle에서 작업하는 간단한 사례에 응답 했으므로 실제 앱에서이 컨텍스트가 변경되었다고 가정 할 것입니다. 따라서이 솔루션은 그림에서 이것을 제거하고 라이브와 함께 클릭 대상을 사용하므로 여전히 jQuery 1.3에서 작동합니다.

$("#buttonContainer ul li").live("click",function(e){ 
    if($(e.target).hasClass('selected')){ 
    console.log('selected'); 
    } 
    console.log('any li'); 
}); 

Answer 2

잘 작동합니다. 하지만 on() ... live()은 더 이상 사용되지 않습니다.

Live Example

$(function() { 
    $("div#buttonContainer ul").on("click", "li", function() { 
     if ($(this).hasClass('selected')) { 
      alert('selected'); 
     } 
    }); 
});​ 

Answer 3

나는 live() 공식적으로 jQuery를 1.7로 사용되지 않습니다으로, on()를 사용하여 전환 말했다했습니다

$("#buttonContainer ul li").on("click", function(e) { 
    var target = $(e.target); 
    if (target.hasClass('selected')) { 
     alert('selected'); 
    } 
});​ 

JS Fiddle demo합니다.