CoffeeScript - JQuery가 켜진 상태에서 동적으로 로드된 개체에 대한 클릭 이벤트 바인딩
내 사이트의 프런트엔드를 커피스크립트로 다시 작성하는 중입니다.클릭 함수를 클래스에 바인딩하는 방법을 이해합니다.
$('.song').click ->
//code
그러나 동적으로 로드된 콘텐츠에 문제가 있습니다.JQuery에서 이에 대한 해결책은 다음과 같이 "On" 기능을 사용하는 것입니다.
$(document).on('click', '.song', function(){
//code
});
하지만 저는 이것이 커피 스크립트로 어떻게 해석되는지 확신할 수 없습니다.저는 로켓 화살표 ->가 자바스크립트에서 익명 함수로 번역된다는 인상을 받고 있습니다만, 함수가 매개 변수 중 하나라면 어떻게 작동합니까?저는 꽤 많은 다른 구문을 시도해 보았지만 아무 것도 작동하지 않는 것 같습니다, 감사합니다!
보통 CoffeeScript에서 괄호가 없으면 괄호를 사용하지 않습니다.그래서 이것은 다음과 같이 쓸 수 있습니다.
$(document).on 'click', '.song', ->
### code ###
하지만 물론 실행 순서가 명확하지 않을 때는 항상 괄호를 사용해야 합니다.
$(document).on('click', '.song', ( ->
### code ###
));
다음 JavaScript로 변환합니다.
$(document).on('click', '.song', (function() {
/* code */
}));
다음을 사용할 수 있습니다.=>
대신 연산자->
이중 화살표를 사용하면 또한 바인딩됩니다.this
이벤트 핸들러에 적용됩니다(jQuery의 바인딩 사용과 동일).
JS2Coffee는 다음과 같은 유형의 질문에 도움이 될 수 있습니다.
Js2 커피는 때때로 꽤 까다로운 JS 코드에서 비틀거리기 때문에 조금 조심해야 하지만, 놀라울 정도로 정확하고, 적어도 당신을 꽤 가깝게 해줄 것입니다.
언급URL : https://stackoverflow.com/questions/8873678/coffeescript-binding-click-events-to-dynamically-loaded-objects-with-jquery-on
'programing' 카테고리의 다른 글
잠금 모드 유형을 활성화하는 방법.Spring Data JPA를 사용하여 엔티티를 조회할 때의 SEPMISTIC_WRITE? (0) | 2023.08.26 |
---|---|
Vuejs Ready 기능이 트리거되지 않았습니다. (0) | 2023.08.26 |
CSS에서 '@' 기호의 목적은 무엇입니까? (0) | 2023.08.26 |
express는 'body-parser deprecommended extended'로 오류를 발생시킵니다. (0) | 2023.08.26 |
Set-Content가 내 파일 끝에 새 줄(줄 바꿈, CRLF)을 추가합니다. (0) | 2023.08.26 |