jQuery 루프에서 바인드 전환

Question

루프를 통해 클릭 이벤트를 바인딩하려고합니다.

원래 바인드 (this 사용)를 기준으로 참조하는 한이 작동합니다. 문제는 내가 토글하는 요소가 DOM의 별도 부분에 있기 때문에 비현실적인 사용 this입니다.

결과,이 상황에서 라인 4는 항상 "이미지"를 참조합니다.

커피 스크립트는 :

for name in ["contact", "kws", "image"] 
    $("#expand-#{name}").bind('click', -> 
    $(this).toggleClass("icon-plus-sign").toggleClass("icon-minus-sign") 
    $(".#{name}-expander").toggle() 
) 

슬프게도, 나는 그림의 모든 코드를 반복하는 것입니다.

덕분에, 저스틴 내가 제대로 질문을 이해한다면

Answer 1

, 당신은 변수 범위의 문제가 있습니다. name은 항상 핸들러가 실행될 때 할당 된 마지막 값입니다.

for name in ["contact", "kws", "image"] 
    do (name) -> 
     $("#expand-#{name}").bind('click', -> 
      $(this).toggleClass("icon-plus-sign").toggleClass("icon-minus-sign") 
      $(".#{name}-expander").toggle() 
     )