Turbolinks JS 구조

Laravel 5.2 응용 프로그램에서 Turbolinks를 사용하려고하는데 일부 페이지에는 추가 JS가 필요하다고 간주하여 일부 js 오류가 있습니다. 내가 먼저로드 어떤 페이지의 특정 JS로드하는 방법을 알아낼 수 없습니다Turbolinks JS 구조

여기 내 현재 마스터 레이아웃의 (머리 부분에 또는 콘텐츠 섹션 ??? 후) : 지금

<!DOCTYPE html> 
<html> 
<head> 
    <title>@yield('title')</title> 
    <!-- Load CSS --> 
    @include('assets.css') 
    <!--------------> 
    <!-- Load jQuery --> 
    <script src="{{ URL::asset('js/jquery-2.1.4.min.js')}}"></script> 
    <script src="{{URL::asset('js/jquery.turbolinks.min.js')}}"></script> 
    <script src="{{URL::asset('js/jquery.address.js')}}"></script> 
    @yield('head') 
    <script src="{{ URL::asset('js/turbolinks.js')}}"></script> 
    <!-----------------> 
</head> 
<body> 
<!-- Load Navbar --> 
@include('elements.html.navbartop') 
<!-----------------> 
<div class="pusher"> 

    <div id="content" class="ui main container" style="margin: 85px 0 50px 0"> 
     <!-- Load Content --> 

     @yield('content') 
     <!------------------> 
    </div> 
</div> 
<!-- Load Footer --> 
@include('elements.html.footer') 
<!-----------------> 
<!----> 
<script src="{{ URL::asset('js/semantic.min.js')}}"></script> 
<!---------------------> 
<script> 
    @include('ajax.search') // searchbar ajax 
</script> 
</body> 
</html>

다른 페이지 :

@extends('layout.master') 

@section('title', 'Dashboard') 

@section('head') 
<script> 
    $(document).ready(function() {  

     $('element').dowhatever; 
    }); 

</script> 
@endsection 

@section('content') 
.... 
@endsection

출처

2016-08-11 user3813360

오류가 무엇입니까? –

(시맨틱 UI)를 사용하고있는 CSS 프레임 워크와 함께 제공되는 javascript 구성 요소가 정의되어 있지 않습니다. – user3813360

OK, 답변을 추가 했으므로 도움이됩니다. –

대신 $(document).ready 이벤트를 사용하여, 당신은이 같은 turbolinks로드 이벤트를 사용해야합니다

이

document.addEventListener("turbolinks:load", function() { 
    $('element').dowhatever; 
});

는 또한이 방식을 이해할 필요가 Turbolinks 5 작품 때문에 부하 및 초기 페이지로드에있는 모든 스크립트를 평가 그리고 나서 현재 head 요소에 추가하십시오.

출처

2016-08-12 15:04:32

복잡하지 않아야합니다. 특정보기에서 일부 추가 JS를로드하려고합니다. – user3813360

내가 제대로 작동한다고 생각합니다. – user3813360

내가 추천 페이지의 하단에있는 JS 스크립트를 호출 조언 않는 파일은 같아야합니다 :

<html> 
<head> 
    <title>@yield('title')</title> 
    <!-- Load CSS --> 
    @include('assets.css') 
    <!--------------> 
</head> 
<body> 
<!-- Load Navbar --> 
@include('elements.html.navbartop') 
<!-----------------> 
<div class="pusher"> 

    <div id="content" class="ui main container" style="margin: 85px 0 50px 0"> 
     <!-- Load Content --> 

     @yield('content') 
     <!------------------> 
    </div> 
</div> 
<!-- Load Footer --> 
@include('elements.html.footer') 
<!-----------------> 
<!----> 
    <!-- Load jQuery --> 
    <script src="{{ URL::asset('js/jquery-2.1.4.min.js')}}"></script> 
    <script src="{{ URL::asset('js/semantic.min.js')}}"></script> 
    <script src="{{URL::asset('js/jquery.turbolinks.min.js')}}"></script> 
    <script src="{{URL::asset('js/jquery.address.js')}}"></script> 
    @yield('head') 
    <script src="{{ URL::asset('js/turbolinks.js')}}"></script> 
    <!-----------------> 
<!---------------------> 
<script> 
    @include('ajax.search') // searchbar ajax 
</script> 
</body> 
</html>

터보 링크 전에 의미를로드하십시오.

출처

2016-08-12 00:46:34

'Uncaught TypeError : $ (...). 탭이 함수가 아닙니다 .'와 같은 오류가 계속납니다. – user3813360

여기에서 전체 코드를 디버깅 할 수 없습니다. 첫 번째 문제가 해답을 얻은 경우 수락 한 것으로 표시하고 새 질문을하십시오. –

아니, 터보 링크가 작동하는 방법을 모르겠다 – user3813360

Turbolinks JS 구조

답변

관련 문제