2017-07-03 4 views
0

Ich habe versucht, meine Front-End mit diesem Codepen Template zu tun, aber wenn ich versuche, auf den Anmelde-Button klicken, ändert sich nicht zu Anmeldeformular, für die der Code im Index ist .js-Datei, ich habe hte index.js-Datei in die login.html.erb aufgenommen, aber wenn ich den Rails-Server leite, funktioniert der Übergang nicht. My Rails Project, Codepen Template ist die Javascript-Code in index.jsJavaScript-Code funktioniert nicht in Ruby on Rails

document.querySelector('.img__btn').addEventListener('click', function() { 
document.querySelector('.cont').classList.toggle('s--signup'); }); 

Antwort

1

in app/assets/javascripts/application.js Ihre aktuellen JS-Code Wickeln innerhalb eines DOMContentLoadListenerEreignis-Listener:

document.addEventListener('DOMContentLoaded', function() { 
    document.querySelector('.img__btn').addEventListener('click', function() { 
    document.querySelector('.cont').classList.toggle('s--signup'); 
    }); 
}); 
+0

Da Sie zweimal das gleiche Stück Code haben, kann es in der 'application.js' oder in der' index.js' Datei gemacht werden. Sie könnten dann in Betracht ziehen, das wiederholte zu entfernen. –

+0

Do RoR den application.js Code automatisch hinzufügen oder manuell mit javascript_include_tag ?? –

+0

Auch danke @Sebastion, du hast den Tag nochmal gerettet, es hat funktioniert aber kannst du bitte sagen was es genau ist ?? –

2

Versuchen Sie, den Weg der index.js Ändern Fügen Sie diese Zeile in app.html hinzu, um die index js-Datei zu integrieren.

<%= javascript_include_tag "index" %> 
+0

Ich habe index.js bereits im Ordner asstes/javascripts hinzugefügt, der der Standardordner für Ruby on Rails ist, aber immer noch nicht funktioniert. –

+0

@AashishKumar hast du die Ansichtsquelle der Seite überprüft? – Vishal

+0

Nein, ich habe nicht, aber die obige Antwort von Sebastian gearbeitet, ich muss den Js-Code in DOMContentLoaded enthalten, es hat funktioniert, aber ich weiß nicht über DOMContentLoaded, können Sie mir bitte sagen, was es ist? –