webentwicklung-frage-antwort-db.com.de

schienen und Bootstrap: Nicht abgerufener ReferenceError: jQuery ist nicht definiert

Ich erstellte eine einfache Webapp-Anwendung, die Bootstrap 3 in eine Rails 3.2.17-Anwendung integriert, und folgte der Prozedur this , die auf stackoverflow gefunden wurde, also ohne Verwendung eines gem, sondern manuellem Kopieren der Bootstrap-Dateien in die entsprechenden Anwendungsverzeichnisse. 

Selbst wenn ich in meiner Edelsteindatei habe:

gem 'jquery-Rails'

ich kann immer noch sehen, wie ich meine Webseite mit Chrome inspiziere:

Uncaught ReferenceError: jQuery is not defined 

Meine Seite ist eine "normale" HTML-Seite im öffentlichen Verzeichnis. Vielleicht "erbt" er nicht alle Assets? Der Code ist wie folgt: 

 <! DOCTYPE html> 
 <Html> 
 <Head> 
 <title> Bootsrap-Test 01 </ title> 
 <link rel = "stylesheet" href = "/ css/bootstrap.css"> 
 <script src = "/ js/bootstrap.min.js" type = "text/javascript"> </ script> 
 </ head> 

...

Ich habe es noch nicht ausprobiert, aber ich denke, dass Javascript-basierte Funktion nicht funktionieren wird. 

22
AgostinoX

Angenommen, Sie haben nach dem Hinzufügen von gem 'jquery-Rails' den Befehl bundle install ausgeführt. 

Stellen Sie sicher, dass Sie Folgendes in app/assets/javascripts/application.js haben.

//= require jquery
//= require jquery_ujs
//= require bootstrap.min   // Add it after jquery and jquery_ujs

EDIT

Sie müssen jQuery explizit einschließen, bevor Sie /bootstrap.min.js einfügen. Zum Beispiel :

<!DOCTYPE html>
<html>
<head>
    <title>Bootsrap Test 01</title>
    <link rel="stylesheet" href="/css/bootstrap.css">
    <script src="/assets/jquery.js" type="text/javascript"></script>
    <script src="/assets/jquery_ujs.js" type="text/javascript"></script>
    <script src="/js/bootstrap.min.js" type="text/javascript"></script>
</head>
27
Kirti Thorat

in 'application.js' von Rails 5.0.1 ist der Standardwert

//= require bootstrap
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .

Ändern Sie es in 

//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
//= require bootstrap

* Erstes Jquery vor dem Bootstrap laden

11
mpalencia

Selbst wenn Sie JQuery richtig eingestellt haben, können Sie immer noch dieses Problem sehen, wenn Sie Inline-Javascript-Code aufrufen, bevor JQuery initialisiert wird.

Sie können Ihren Javascript-Code in einpacken

document.addEventListener("DOMContentLoaded", function(event) { 
  //do work with $
});

Oder überarbeiten Sie Ihren Code so, dass kein Inline-Javascript verwendet wird :)

11
Serge Seletskyy

Ein weiterer zu überprüfender Ort ist der <head> der application.html.erb-Datei.

Stellen Sie sicher, dass Sie vor dem Bootstrap-Javascript in jQuery geladen werden.

1
ConorB

Ich habe dieselbe Fehlermeldung in der Konsole gefunden.

Stellen Sie nur sicher, dass sich jQuery in Ihrer Datei 'assets/javascripts/application.js' über Bootstrap befindet

Lösung:

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require bootstrap
0
kai_onthereal