Beide Seiten der vorigen RevisionVorhergehende ÜberarbeitungNächste Überarbeitung | Vorhergehende Überarbeitung |
de:create:javascript [09.10.2020 21:01] – [JavaScript lernen] eric.frodl | de:create:javascript [28.05.2022 17:38] (aktuell) – [Fehler finden] admin |
---|
Falls der Fragebogen direkt auf Klicks oder Eingaben des Teilnehmers reagieren soll ([[:de:create:dynamic|Fragen bei Auswahl einer bestimmten Option sofort einblenden]]), ist die Verwendung von [[:de:glossary#javascript|JavaScript]] erforderlich. JavaScript wird direkt im Browser des Teilnehmers ausgeführt (sofern dieser JavaScript nicht deaktiviert hat) und kann unmittelbar auf Benutzereingaben reagieren. Allerdings kann man mittels JavaScript nicht oder nur eingeschränkt auf das aktuelle Interview (z.B. frühere Antworten des Teilnehmers) zugreifen. | Falls der Fragebogen direkt auf Klicks oder Eingaben des Teilnehmers reagieren soll ([[:de:create:dynamic|Fragen bei Auswahl einer bestimmten Option sofort einblenden]]), ist die Verwendung von [[:de:glossary#javascript|JavaScript]] erforderlich. JavaScript wird direkt im Browser des Teilnehmers ausgeführt (sofern dieser JavaScript nicht deaktiviert hat) und kann unmittelbar auf Benutzereingaben reagieren. Allerdings kann man mittels JavaScript nicht oder nur eingeschränkt auf das aktuelle Interview (z.B. frühere Antworten des Teilnehmers) zugreifen. |
| |
Innerhalb des Fragebogens steht die JavaScript-Bibliothek ''[[:de:create:soscitools|SoSciTools]]'' zur Verfügung. Diese stellt hilfreiche Funktionen bereit, um die Arbeit mit Fragebogen-Inhalten zu erleichtern. Außerdem können mit dem PHP-Befehl ''[[:de:create:functions:library|library()]]'' Standard-Bibliotheken wie jQuery, SCEditor oder (falls auf dem Server verfügbare) Highcharts eingebunden werden. | Innerhalb des Fragebogens steht die JavaScript-Bibliothek ''[[:de:create:soscitools|SoSciTools]]'' zur Verfügung. Diese stellt hilfreiche Funktionen bereit, um die Arbeit mit Fragebogen-Inhalten zu erleichtern. Außerdem können mit dem PHP-Befehl ''[[:de:create:functions:library|library()]]'' Standard-Bibliotheken wie jQuery, SCEditor oder ChartJS eingebunden werden. |
| |
| |
**Hinweis:** Die Verwendung von JavaScript kann der Barrierefreiheit schaden. Personen, die den Fragebogen etwa mittels ScreenReader ausfüllen, sind darauf angewiesen, dass das Ausfüllen auch mit der Tastatur möglich ist. | **Hinweis:** Die Verwendung von JavaScript kann der Barrierefreiheit schaden. Personen, die den Fragebogen etwa mittels ScreenReader ausfüllen, sind darauf angewiesen, dass das Ausfüllen auch mit der Tastatur möglich ist. |
| |
**Tipp:** Wenn eine JavaScript-Funktion nicht funktioniert, ist man auf die Fehlerkonsole des Browsers angewiesen. Eventuelle Fehler im Skript sieht man erst, wenn man die Fehlerkonsole öffnet. | **Tipp:** Wenn eine JavaScript-Funktion nicht funktioniert, ist man auf die [[:de:general:browser-tools|Fehlerkonsole des Browsers]] angewiesen. Eventuelle Fehler im Skript sieht man erst, wenn man die Fehlerkonsole öffnet. |
| |
**Tipp:** Wenn Sie eigenes JavaScript programmieren, achten Sie darauf, dass der Fragebogen auch bei deaktiviertem JavaScript ausgefüllt werden kann. | **Tipp:** Wenn Sie eigenes JavaScript programmieren, achten Sie darauf, dass der Fragebogen auch bei deaktiviertem JavaScript ausgefüllt werden kann. |
===== Fehler finden ===== | ===== Fehler finden ===== |
| |
Wenn der JavaScript-Code einmal nicht funktioniert, wie er soll, dann gibt es für die Fehlersuche die Fehlerkonsole des Browsers. Diese findet man -- je nach Browser -- an unterschiedlicher Stelle ([[http://webmasters.stackexchange.com/a/77337/30902|Shortcuts (engl.)]], [[https://codex.wordpress.org/Using_Your_Browser_to_Diagnose_JavaScript_Errors#Step_3:_Diagnosis|Wordpress (engl.)]], [[http://www.stramaxon.com/2013/10/developer-tools-in-browser.html|How to Open Developer Tools (engl.)]]). | Wenn der JavaScript-Code einmal nicht funktioniert, wie er soll, dann gibt es für die Fehlersuche die [[:de:general:browser-tools]]. |
| |
In der Fehlerkonsole sieht man einerseits Fehler im Code. Andererseits kann man dort anzeigen lassen, was in einer Variable gespeichert ist. Und zwar mittels `console.log()`. Folgende Zeilen identifizieren ein Eingabefeld mit der HTML-ID "AB01_01" und zeigen anschließend in der Konsole, ob es gefunden wurde. | In der Fehlerkonsole der Entwickler-Tools sieht man einerseits Fehler im Code. Andererseits kann man dort anzeigen lassen, was in einer Variable gespeichert ist. Und zwar mittels `console.log()`. Folgende Zeilen identifizieren ein Eingabefeld mit der HTML-ID "AB01_01" und zeigen anschließend in der Konsole, ob es gefunden wurde. |
| |
<code javascript> | <code javascript> |
===== JavaScript lernen ===== | ===== JavaScript lernen ===== |
| |
Didaktisch aufbereitet ist folgener 30-stündiger kostenloser Kurs der Duke University: [[https://www.coursera.org/learn/duke-programming-web?#syllabus|Programming Foundations with JavaScript, HTML and CSS]] | Didaktisch aufbereitet ist folgender 30-stündiger kostenloser Kurs der Duke University: [[https://www.coursera.org/learn/duke-programming-web?#syllabus|Programming Foundations with JavaScript, HTML and CSS]] |
| |
Darüber hinaus findet man im Internet mehrere JavaScript-Einsteigerkurse, z.B. [[https://www.javascript-kurs.de/|JavaScript lernen für Anfänger]] oder [[https://lerneprogrammieren.de/javascript/|JavaScript Lernen: So lernst du es schnell & einfach]] | Darüber hinaus findet man im Internet mehrere JavaScript-Einsteigerkurse, z.B. [[https://www.javascript-kurs.de/|JavaScript lernen für Anfänger]] oder [[https://lerneprogrammieren.de/javascript/|JavaScript Lernen: So lernst du es schnell & einfach]] |