Структура Turbolinks JS

Я пытаюсь использовать Turbolinks с моим приложением Laravel 5.2, есть некоторые ошибки 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

Какая ошибка вы получите? –

Компоненты javascript, снабженные фреймворком CSS, который я использую (Semantic UI), не определены – user3813360

Хорошо, я добавил ответ, надеюсь, что это поможет. –

Вместо того, чтобы использовать $(document).ready события, вы должны использовать событие turbolinks нагрузки, как это:

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

Кроме того, необходимо понимать так, что Turbolinks 5 работ, так как нагрузка и оценить любой сценарий на начальной загрузке страницы а затем добавить к текущему элементу головы.

источник

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>

Также загружайте семантику перед Turbolinks.

источник

2016-08-12 00:46:34

По-прежнему возникают ошибки, такие как 'Uncaught TypeError: $ (...). Tab не является функцией' – user3813360

Здесь мы не можем отлаживать весь ваш код. Если ответ разрешил вашу первую проблему, отметьте ее принятой и задайте новый вопрос. –

Нет, это не так, я не понимаю, как работает turbolinks – user3813360

Структура Turbolinks JS

ответ

Смежные вопросы