Turbolinks JS structure

Laravel 5.2アプリケーションでTurbolinksを使用しようとしていますが、いくつかのページに余分なJSが必要であると考えて、いくつかのjsエラーがあります。私が最初にロードする何ページ特定JSロードする方法を見つけ出すことはできませんTurbolinks JS structure

ここに私の現在のマスターレイアウトです（headセクションでは、コンテンツセクション???後）：今

<!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>

別のページ：私はお勧めして、ページの下部にあるJSスクリプトを呼び出す助言ん

@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

、あなたのファイルがそのようになります。

<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：$（...）。tabは関数ではありません。 ' – user3813360

ここでコード全体をデバッグすることはできません。あなたの最初の問題が解決した場合は、それをマークして新しい質問をしてください。 –

いいえ、私はturbolinksがどのように働くのか分からない – user3813360

Turbolinks JS structure

答えて

関連する問題