Rails 4 및 Turbo-Links를 사용하여 jQuery 이벤트를 안정적으로 트리거하려면 어떻게 해야 합니까?

Turbo-Link를 사용하여 Rails 4에서 jQuery 이벤트 활용

Rails 4 개발자는 Turbo-Link를 활용하면서 JavaScript 파일을 구성하는 딜레마에 자주 직면합니다. . 일반적으로 jQuery의 "ready" 이벤트는 페이지 로드 시 JavaScript 실행을 트리거하는 데 사용됩니다. 그러나 Turbo-Links가 활성화된 경우 후속 페이지 전환 시 이 이벤트가 실행되지 않습니다.

이 문제를 해결하려면 Turbo-Links 작동 방식을 이해하는 것이 중요합니다. 기존 페이지 다시 로드와 달리 Turbo-Links는 새 페이지를 완전히 로드하지 않고도 원활한 페이지 전환을 허용합니다. 결과적으로 DOM의 초기 로드 프로세스에 바인딩된 jQuery의 "ready" 이벤트는 첫 번째 페이지 로드 이후 더 이상 트리거되지 않습니다.

다행히 Turbo-Links가 솔루션을 제공합니다. 새 페이지가 전환될 때마다 "page:load" 이벤트를 브로드캐스트합니다. 이 이벤트는 jQuery의 "ready" 이벤트 동작을 모방하고 JavaScript 코드의 적절한 실행을 보장하는 데 활용될 수 있습니다.

CoffeeScript에서는 다음과 같이 달성할 수 있습니다.

ready = ->

  # JavaScript code

$(document).ready(ready)
$(document).on('page:load', ready)

바닐라에서 JavaScript의 해당 코드는 다음과 같습니다.

var ready;
ready = function() {

  # JavaScript code

};

$(document).ready(ready);
$(document).on('page:load', ready);

Rails 5 및 Turbolinks 5에서는 "page:load" 이벤트가 발생했습니다. "turbolinks:load"로 대체되었습니다. 이 경우 JavaScript 코드는 다음과 같이 단순화될 수 있습니다.

$(document).on('turbolinks:load', function() {

  # JavaScript code

});

이러한 기술을 활용하여 Rails 4 개발자는 Turbo-Link가 활성화된 경우에도 jQuery 이벤트가 안정적으로 작동하도록 보장하여 원활하고 응답성이 뛰어난 사용자를 확보할 수 있습니다. 경험하세요.

위 내용은 Rails 4 및 Turbo-Links를 사용하여 jQuery 이벤트를 안정적으로 트리거하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!