jQuery in Javascripts Vermögen nicht Brennen

Question

Wenn ich diesen Code innerhalb des erb platzieren Sie es sehen können perfekt

<script type="text/javascript"> 
    $('.disabled-course').click(function() { 
    $('#alert').html(
     '<div class="alert alert-warning alert-dismissible">' + 
     ' <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>' + 
     ' <h4><i class="icon fa fa-warning"></i>¡Alerta!</h4>' + 
     ' Los cursos en vivo solo están disponibles para usuarios premium' + 
     '</div>' 
    ); 
    }) 
</script> 

Allerdings funktioniert, wenn ich den gleichen Code platzieren (mit Ausnahme der Script-Tags) innerhalb seiner eigenen Datei in das Vermögen/Javascripts Ordner funktioniert nicht mehr. Ich bekomme auch keine Unicode-Zeichen richtig zu zeigen (I get 'á' anstelle von 'A')

Dies ist, wie die JS-Datei durch Schienen erzeugt wie folgt aussieht:

$('.disabled-course').click(function() { 
    $('#alert').html(
    '<div class="alert alert-warning alert-dismissible">' + 
    ' <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>' + 
    ' <h4><i class="icon fa fa-warning"></i>¡Alerta!</h4>' + 
    ' Los cursos en vivo solo están disponibles para usuarios premium' + 
    '</div>' 
); 
}) 

ich schon vergewissert, dass jQuery vor alles andere enthalten ist, auch versucht, es in einem $(document).ready(function() {}

Answer 1

Vergewissern Sie sich in Ihrem application.js manifest Sie mit der JavaScript-Datei setzen:

ap plication.js

//= require jquery 
.. A bunch of other requires 
//= require name_of_js_file 

Dies würde eine Datei namens app/assets/javascripts/name_of_js_file.js laden. Stellen Sie sicher, dass name_of_js_file.js geladen ist, indem Sie Ihre Dev Tools-Konsole überprüfen. Sie können auch eine console.log hinzufügen, die ausgelöst wird, wenn das Skript als Plausibilitätsprüfung geladen wird.

Auch, um sicher zu sein, würde ich immer diese Art von Code in einem $(document).ready(function() {} Rückruf, wie du erwähnt, wickeln. Der Grund dafür ist, dass selbst wenn jQuery geladen wird, Ihr Element $('.disabled-course') möglicherweise noch nicht einmal auf der Seite vorhanden ist.