Hier werden die Unterschiede zwischen zwei Versionen angezeigt.
Beide Seiten der vorigen RevisionVorhergehende ÜberarbeitungNächste Überarbeitung | Vorhergehende Überarbeitung | ||
de:create:questions:selclick [27.01.2015 14:49] – Aktualisiert admin | de:create:questions:selclick [01.10.2020 21:56] (aktuell) – [Teilfragen überspringen] admin | ||
---|---|---|---|
Zeile 31: | Zeile 31: | ||
* Eine Filterführung zwischen den Teilfragen ist nicht möglich. | * Eine Filterführung zwischen den Teilfragen ist nicht möglich. | ||
* Die Auswahl-Abfolge benötigt zur korrekten Funktion [[: | * Die Auswahl-Abfolge benötigt zur korrekten Funktion [[: | ||
+ | |||
+ | |||
+ | ===== JavaScript ===== | ||
+ | |||
+ | Der Container der Frage (die Fragekennung mit einem angehängten '' | ||
+ | |||
+ | Mehr zur Einbindung von JavaScript in den Fragebogen s. [[https:// | ||
+ | |||
+ | |||
+ | ==== Auf Auswahl reagieren ==== | ||
+ | |||
+ | Das Ereignis enthält in `CustomEvent.detail` die Kennung der Frage ('' | ||
+ | |||
+ | <code javascript> | ||
+ | <script type=" | ||
+ | function onSelect(evt) { | ||
+ | var info = evt.detail; | ||
+ | alert(" | ||
+ | } | ||
+ | |||
+ | var question = document.getElementById(" | ||
+ | question.addEventListener(" | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | Mittels '' | ||
+ | |||
+ | <code javascript> | ||
+ | <script type=" | ||
+ | function onSelect(evt) { | ||
+ | // In Teilfrage 1 kann die Option 2 nicht (!) ausgewählt werden | ||
+ | if ((evt.detail.item == 1) && (evt.detail.value == 2)) { | ||
+ | evt.preventDefault(); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | var question = document.getElementById(" | ||
+ | question.addEventListener(" | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | |||
+ | ==== Audio abspielen beim Erscheinen des Items ==== | ||
+ | |||
+ | Falls man [[: | ||
+ | |||
+ | Hier kann man mit dem '' | ||
+ | |||
+ | <code html> | ||
+ | Hörbeispiel 1 | ||
+ | <audio id=" | ||
+ | <source src=" | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | Wie im vorigen Beispiel wird nun eine Funktion definiert, welche auf Basis der Nummer der Teilfrage ('' | ||
+ | |||
+ | <code javascript> | ||
+ | <script type=" | ||
+ | function onPresent(evt) { | ||
+ | // Die HTML-ID setzt sich aus " | ||
+ | var item = evt.detail.item; | ||
+ | var audio = document.getElementById(" | ||
+ | if (audio) { | ||
+ | audio.play(); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | var question = document.getElementById(" | ||
+ | question.addEventListener(" | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | |||
+ | ==== Teilfragen überspringen ==== | ||
+ | |||
+ | Die JavaScript-Methode '' | ||
+ | |||
+ | Das folgende Beispiel überspringt eine Teilfrage in der Auswahlabfolge " | ||
+ | |||
+ | <code javascript> | ||
+ | <script type=" | ||
+ | window.addEventListener(" | ||
+ | if (e.keyCode == 32){ | ||
+ | SoSciTools.questionnaire.AA01.skipItem(); | ||
+ | } | ||
+ | }); | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | Schlagwörter: |