programing

CoffeeScript - JQuery가 켜진 상태에서 동적으로 로드된 개체에 대한 클릭 이벤트 바인딩

codeshow 2023. 8. 26. 00:08
반응형

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는 다음과 같은 유형의 질문에 도움이 될 수 있습니다.

http://js2coffee.org/

Js2 커피는 때때로 꽤 까다로운 JS 코드에서 비틀거리기 때문에 조금 조심해야 하지만, 놀라울 정도로 정확하고, 적어도 당신을 꽤 가깝게 해줄 것입니다.

언급URL : https://stackoverflow.com/questions/8873678/coffeescript-binding-click-events-to-dynamically-loaded-objects-with-jquery-on

반응형