Rails, javascript가 link_to helper를 클릭 한 후로드되지 않음
레일에서 link_to 도우미를 사용할 때 자바 스크립트를로드하는 데 문제가 있습니다. 'localhost : 3000 / products / new'를 사용하여 URL을 수동으로 입력하거나 페이지를 다시로드하면 자바 스크립트가로드되지만 아래와 같이 링크를 통해 이동하면 jQuery $(document).ready
가 새 페이지에로드되지 않습니다.
Link_to, javascript가이 링크를 클릭 할 때로드되지 않습니다.
<%= link_to "New Product", new_product_path %>
products.js 파일
$(document).ready(function() {
alert("test");
});
어떤 도움이라도 대단히 감사하겠습니다. 미리 감사드립니다!
Rails 4를 사용하고 있습니까? ( rails -v
콘솔에서 확인)
이 문제는 새로 추가 된 Turbolinks gem 때문일 수 있습니다. 응용 프로그램이 단일 페이지 JavaScript 응용 프로그램처럼 작동하도록합니다. 몇 가지 이점이 있지만 ( 더 빠름 ) 불행히도 $(document).ready()
페이지가 다시로드되지 않기 때문에 기존 이벤트를 중단 합니다. 이는 URL을 직접로드 할 때 JavaScript가 작동하는 이유를 설명하지만 link_to
.
여기 Turbolinks에 대한 RailsCast 가 있습니다.
몇 가지 해결책이 있습니다. 당신은 사용할 수 있습니다 jquery.turbolinks을 드롭 인 수정으로, 또는 당신은 당신의 전환 할 수 있습니다 $(document).ready()
대신 Turbolinks를 사용하는 문 'page:change'
이벤트를 :
$(document).on('page:change', function() {
// your stuff here
});
또는 일반 페이지로드 및 Turbolink와의 호환성을 위해 다음과 같이 할 수 있습니다.
var ready = function() {
// do stuff here.
};
$(document).ready(ready);
$(document).on('page:change', ready);
Ruby on Rails> 5 ( rails -v
콘솔에서 실행 하여 확인할 수 있음 )를 사용 'turbolinks:load'
하는 경우'page:change'
$(document).on('turbolinks:load', ready);
나는 같은 문제가 있지만 jquery.turbolinks 는 도움이되지 않습니다. GET 메서드를 재정의해야한다는 것을 알았습니다.
내 샘플이 있습니다.
<%= link_to 'Edit', edit_interpreter_path(@interpreter), method: :get %>
대신 레일 5에있는 경우 다음 과 같이 'page:change'
사용해야 'turbolinks:load'
합니다.
$(document).on('turbolinks:load', function() {
// Should be called at each visit
})
출처 : https://stackoverflow.com/a/36110790
data-no-turbolink를 지정하는 div로 링크를 래핑 할 수도 있습니다.
예:
<div id="some-div" data-no-turbolink>
<a href="/">Home (without Turbolinks)</a>
</div>
출처 : https://github.com/rails/turbolinks
인라인 <script>
태그 가 없는지 확인하십시오 . (인라인 스크립트 태그는 터보 링크에 적합하지 않습니다.)
FWIW, Turbolinks 문서 에서 대신 캡처 할 더 적절한 이벤트 $(document).ready
는 page:change
.
page:load
캐시 재로드시 실행되지 않는다는 경고가 있습니다 ...
새 body 요소가 DOM에로드되었습니다. 부분 교체시 또는 페이지가 캐시에서 복원 될 때 실행되지 않으므로 동일한 본문에서 두 번 실행되지 않습니다.
그리고 Turbolinks는 단지보기를 전환하기 때문에 page:change
더 적합합니다.
'your programing' 카테고리의 다른 글
로드 할 때 특정 위치에서 HTML5 비디오를 시작 하시겠습니까? (0) | 2020.10.15 |
---|---|
일식이 Avd 관리자 창 및 Android 프로젝트를 표시하지 않음 (0) | 2020.10.15 |
Django : 날짜 별 그룹화 (일, 월, 연도) (0) | 2020.10.15 |
파일 모드가 명시 적으로 DOS 인 경우에도 캐리지 리턴 (^ M)을 표시하는 gVim (0) | 2020.10.15 |
파이썬에서 가장 짧은 스도쿠 솔버-어떻게 작동합니까? (0) | 2020.10.15 |