클릭 핸들러의 콜백 함수로 데이터 수집에 대한 참조를 전달

Question

여기 내 코드가 당분간로 구성되어 있습니다 방법은 다음과 같습니다 나는에서 사람의 이름이다 (링크를 클릭 할 때마다

$.post('includes/getPeople.php', {char: character}, function(data) { 
var peopleData = data.people; 

//generation of HTML markup... 

$("#peopleTable a.nameLink").live("click", function(e) { 
var index = $(this).attr("title"); 
console.log(peopleData[index].Email); 
alert(peopleData[index].Email); 
e.preventDefault(); 
    }); 
} 

데이터베이스), 나는이 오류가 발생 : "peopleData 정의되지"입니다. 이 문제를 해결할 수있는 방법이 있습니까?

감사합니다.

Answer 1

해당 문맥에서 .live()을 사용하면 올바르지 않으며이 오류가 발생한 이유 일 가능성이 큽니다. 대신 .bind()을 사용해야합니다.

• Live
• Bind

당신이 그들의 설명을 선택하면, 당신은 live이 live의 선택과 일치 할 때마다 새로운 HTML 요소가 추가됩니다 bind의 확장의 한 형태임을 알 수 이벤트 처리기는 자동으로 "바인드 됨"이됩니다.

경우에 따라 AJAX 호출을 할 때마다 .live() 함수를 호출하여 HTML 태그가 생성 될 때마다 링크에 새 처리기를 추가하게됩니다.

희망이 있었으면 좋겠다. 설명하기 위해 최선을 다했다.

편집

: 코드를 보면

, peopleData 지금 상황에서 않은 것 같습니다, 그래서 존재하지 않습니다. 이 변수는 포스트 콜백 함수 내부에서 생성되며 click 이벤트 핸들러는 함수 외부에 있습니다.

는 다음과 같은 시도 :

$(function() { 
    var letters = $("ul#peopleLetters li"); 
    var current = $("ul#peopleLetters li.selected"); 
    var d = ''; 
    retrievePeople('#'); 
    letters.click(function() { 
     d = $(this).attr("title"); 
     current.removeClass("selected"); 
     current = $(this); 
     $(this).addClass("selected"); 
     retrievePeople(d); 
    }); 

    function retrievePeople(character) { 
     $.post('includes/getPeople.php', {char: character}, function(data) { 
      var peopleData = data.people; 
      var count = data.count; 
      var markup = ''; 
      var countDetails = ''; 
      countDetails = (character == '#') ? count + " Listings Were Found." : count + " Listing(s) Beginning With The Letter '" + character + "'"; 
      if(count == 0){ markup = "No results were found.";} 
      else { 
       //markup stuff [although, a note here, instead of using data.people, you can, and should use peopleData] 
      } 

      $("#peopleTable a.nameLink").bind("click", {data: peopleData}, function(e) { 
       var index = $(this).attr("title"); 
       console.log(data[index].Email); 
       alert(data[index].Email); 
       e.preventDefault(); 
      }); 

     $("#allPeople").html(markup); 
     }, "json"); 
    } 
});