Laravel Klinge verwenden Sie $(document).ready Funktion

Ich versuche, laravel blade-templates mit etwas javascript-code in die child-view.

Habe ich meine E-mail - app.blade.php Datei, wo befindet sich Zeichenkette von jquery Initialisierung:

<script src="/js/jquery.min.js"></script>

In meinem Untersicht Datei settings.blade.php will ich mit einige jquery-Funktionen:

@extends('layouts.app')
@section ('content')
Settings main page
@endsection

<script type="text/javascript">
    $(document).ready(function() {
        alert("Settings page was loaded");
    });
</script>

Aber in der browser-Konsole bekomme ich eine Fehlermeldung Uncaught ReferenceError: $ is nicht definiert scheint, wie jquery geladen wurde NACH aufrufen der Funktion in der Untersicht Datei.

Hinzufügen einer Zeile: <script src="/js/jquery.min.js"></script> in settings.blade.php behebt das problem. Ich möchte aber nicht meine Skript-Dateien in jedem meiner Untersicht Datei.

Frage also: wie kann ich Last-main javascript\jquery-Dateien in übergeordneten blade-Datei VOR laden Untersicht Dateien?

bitte korrekten Pfad zur js-Datei und js-Datei auf die übergeordnete Seite vor dem laden Untersicht.
Der Weg der js-Datei korrekt ist. Ich bekomme nicht einen Fehler in meinen debugger. Wenn Datei verwendet wird app.blade.php es lädt korrekt, ohne Fehler

InformationsquelleAutor Jukka Newkampton | 2016-04-20

  1. 11

    Folgen Sie bitte diesem Weg

    jquery-Skript-Datei werden diese

    <script src="{!!url('/js/jquery.min.js')!!}"></script>

    und tun dies für den Bereich content

    @extends('layouts.app')
@section ('content')
Settings main page

<script type="text/javascript">
    $(document).ready(function() {
        alert("Settings page was loaded");
    });
</script>

@endsection

    Aktualisiert

    Vielmehr um scripting im Abschnitt "content", es wäre viel besser und professioneller Weise zu erstellen, ein weiterer Abschnitt für die Skripterstellung in app.blade.php

    normalerweise bin ich diesem Weg Folgen

    <html>
  <head> 
    @yield('page-style-files')
  </head>

  <body>
    <div class="wrapper">
     @yield('content')
    </div>
  </body>

  @yield('page-js-files')
  @yield('page-js-script')

<html>

    so zum Beispiel Ihr code wird wie folgt Aussehen

    @extends('layouts.app')
@section ('content')
  Settings main page    
@endsection

@section('page-style-files')
 <link href="....css" />
@stop


@section('page-js-files')
 <script src=".....js"></script>
@stop

@section('page-js-script')
<script type="text/javascript">
    $(document).ready(function() {
        alert("Settings page was loaded");
    });
</script>
@stop
    Ich danke Ihnen sehr. Umzug <script> Tags in @section block mein problem gelöst. Danke!
    Ich aktualisiert meine Antwort, ich erwähnte die Art, wie ich Folgen
    Perfekte Lösung. Ich wendete Sie auf mein Projekt und es funktioniert gut. Wusste nicht, über @seciton -> @stop Blöcke. Ich danke Ihnen sehr

    InformationsquelleAutor Qazi

Schreibe einen Kommentar