jquery trigger 루프에서 클릭하십시오.

Question

안녕하세요, 목록 항목에 페이스 북 친구 미리보기 이미지를 추가하고 각각에 트리거를 추가하려고합니다. 하지만 이제는 클릭이 발생하지만 클릭 콜백 내부에 마지막으로 추가 된 항목은 표시되지 않습니다. 어떻게 각각에 클릭 이벤트를 올바르게 첨부 할 수 있습니까? 당신은 클릭 이벤트에 대한 콜백 함수 내부에 폐쇄 변수 anchor를 사용하고 있기 때문에

for(var i=0;i<obj.photo.length;i++) { 
var img=$('<img src="https://graph.facebook.com/'+obj.photo[i]['fb_id']+'/picture" />'); 
var anchor=$('<a href="#" id="'+obj.photo[i]['fb_id']+'"></a>'); 
var li = $('<li></li>'); 
var fbul = $('#fb_friends'); 

anchor.append(img); 
li.append(anchor); 
fbul.append(li); 

anchor.click(function(){ 
    alert(anchor.attr('id')); 
}); 
} 

Answer 1

문제입니다. 이 문제에 대한 해결책은 아래와 같이 이벤트 속성에서 클릭 된 요소를 가져 오는 것입니다. 이벤트 처리기 메서드 this 안에는 처리기가 등록 된 요소를 가리 킵니다.

anchor.click(function() { 
    var $this = $(this); 
    alert($this.attr('id')); 
}); 

하지만 당신은 .on()

var fbul = $('#fb_friends'); 

fbul.on('click', 'a', function() { 
    var $this = $(this); 
    alert($this.attr('id')); 
}) 

for (var i = 0; i < obj.photo.length; i++) { 
    var img = $('<img src="https://graph.facebook.com/' + obj.photo[i]['fb_id'] 
      + '/picture" />'); 
    var anchor = $('<a href="#" id="' + obj.photo[i]['fb_id'] + '"></a>'); 
    var li = $('<li></li>'); 

    anchor.append(img); 
    li.append(anchor); 
    fbul.append(li); 
}