coffeescript가 dom 요소를 업데이트하지 않습니다.

Question

저는 커피 스크립트를 처음 사용하고 있으며 이벤트에 바인딩하는 데 문제가 있습니다. div가 있는데, ajax를 통해 업데이트 된 다음 반환 된 부분에 정의 된 몇 가지 추가 jquery 이벤트가 필요합니다. 이것은 모두 레일 3.2에서 실행됩니다. 내 js.erb 반환 미세이 부분 :

$('#top_box').empty() 
$('#top_box').append('<%= escape_javascript(render :partial => 'form') %>') 

양식 부분이 하나의 텍스트 필드 내가 JS에 위의 라인을 추가 할 때, 즉

$('#link_long').on('click',function(){ $('#link_long').val("");}) 

을 처리하는 몇 가지 추가 이벤트하려는. 파일을 erb 다음 잘 작동하지만이 커피에서 할 수있는 방법을보고 싶었어요. 그래서, 커피

$ -> 
    $('#link_long').on 'click', -> 
    $('#link_long').val("") 

JS 생성 된 코드와 같은 커피에 그 라인을 번역

(function() { 

$(function() { 
return $('#link_long').on('click', function() { 
return $('#link_long').val(""); 
}); 
}); 

}).call(this); 

하지만 커피 스크립트가 작동하지 않습니다. 누군가 왜 저에게 말할 수 있습니까?

Answer 1

이것은 약간의 추측이지만 부분이 추가되기 전에 이벤트를 바인딩하고있는 것 같습니다. $('#link_long')은 아직 존재하지 않아 아무 일도 일어나지 않기 때문에 요소를 찾지 못합니다. JS -> CS 번역 중단으로 클릭 핸들러가 $ -> 콜백으로 이동했을 가능성이 있습니다. 다시 말하지만 여기서 추측하겠습니다. append이있는 호출 전에 실행됩니다. 어떤 경우에도, 여러 개의 독립적 인 문서 준비 핸들러를 갖는 것은 문제를 요구합니다.

가장 확실한 선택은 APPEND 후 결합되어

또 다른 옵션 (이벤트가 트리거 될 때 당신이 이전에 결합 할 수 있도록 필터링이 수행됩니다 선택기로 필터링 한 다음 문서를 결합하는 것입니다

$('#top_box').append('<%= escape_javascript(render :partial => 'form') %>') 
$('#link_long').on 'click', -> $('#link_long').val("") 

선택한 요소가 있음) :

$(document).on('click', '#link_long', -> $('#link_long').val(""))