Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- de:create:questions:selclick [07.08.2014 13:41] – admin
+++ de:create:questions:selclick [01.10.2020 21:56] (aktuell) – [Teilfragen überspringen] admin
@@ Zeile 1: / Zeile 1: @@
 ====== Auswahl-Abfolge ======
-Die Auswahl-Abfolge fällt in der Bedienung von SoSci Survey ein wenig aus der Reihe: Es handelt sich dabei nicht um eine einzelne Frage, sondern um eine Ansammlung mehrerer Auswahl-Fragen (Teilfragen). Entsprechend legt man in dieser Frage auch keine Items an, sondern Teilfragen -- und zwar über das Menü links (**Fragenkatalog**).
+Die Auswahl-Abfolge zeigt mehrere Auswahlfragen hintereinander (Teilfragen). Die Teilfragen werden einzeln auf dem Bildschirm angezeigt. Die Auswahloptionen werden als Kästchen dargestellt und durch Anklicken ausgewählt -- anschließend erscheint sofort die nächste Teilfrage. Die in einer Teilfrage getroffene Auswahl kann nachträglich nicht geändert werden.
-Jede Teilfrage besteht aus einem Fragetext und den möglichen Auswahloptionen. Die Teilfragen werden einzeln auf dem Bildschirm angezeigt -- durch einfachen Klick auf eine der Antwortvorgaben und __ohne__ Klick auf den "Weiter"-Knopf gelangt man direkt zur nächsten Fragen.
+{{:de:create:scr.question.selclick.png?nolink|Auswahl-Abfolge}}
-Diese Frage ist vor allem für Reaktionszeitmessungen geeignet, für [[:de:create:smartphones|Mobilgeräte]] oder wenn der Fragebogen ein wenig schicker werden soll. Die Auswahloptionen können untereinander, nebeneinander oder im Karree angeordnet werden.
+Technisch fällt die Auswahl-Abfolge ein wenig aus der Reihe: Es handelt sich dabei nicht um eine einzelne Frage, sondern um eine Sammlung mehrerer Auswahl-Fragen (Teilfragen). Jede Teilfrage besteht aus einem Fragetext und den möglichen Auswahloptionen. Entsprechend legt man in dieser Frage auch keine Items an, sondern Teilfragen -- und zwar links im **Fragenkatalog**.
-{{:de:create:scr.question.selclick.png?nolink|Auswahl-Abfolge}}
+Diese Frage ist besonders für Reaktionszeitmessungen geeignet, für Befragungen auf einem [[:de:create:smartphones|Mobilgerät]] oder wenn der Fragebogen ein wenig schicker werden soll. Die Auswahloptionen können untereinander, nebeneinander oder im Karree angeordnet werden.
-**Hinweis:** Geben Sie die für Frage selbst keinen Fragetext ein, es sei denn, dieser soll über allen Teilfragen erscheinen.
+**Hinweis:** Geben Sie die für Frage selbst __keinen__ Fragetext ein, es sei denn, dieser soll über allen Teilfragen erscheinen.
 **Hinweis:** Die Messung der Reaktionszeit ist erst ab der zweiten Teilfrage möglich. Falls Sie mit Reaktionszeiten arbeiten wollen, tragen Sie als erste Teilfrage eine Erklärung (o.ä.) ein und als Auswahloption einfach "Weiter".
 **Wichtig:** Platzieren Sie die Frage alleine auf einer Fragebogenseite -- oder zumindest als letzte Frage auf der Seite. Nachdem die letzte Teilfrage beantwortet wurde, geht es automatisch weiter zur nächsten Fragebogen-Seite.
 ===== Vorteile =====
@@ Zeile 19: / Zeile 20: @@
   * Die großen Auswahl-Kästchen sind komfortabler zu treffen als kleine Auswahlfelder.
   * Da man zwischen den Teilfragen nicht auf den "Weiter"-Knopf drücken oder auf die Übertragung einer neuen Fragebogen-Seite warten muss, geht das Ausfüllen schneller von der Hand.
-  * Die Frage erlaubt eine zuverlässige Reaktionszeitmessung (ms) ab der zweiten Teilfrage.
+  * Die Frage erlaubt eine zuverlässige Reaktionszeitmessung ab der zweiten Teilfrage. Die Reaktionszeit wird in Millisekunden gemessen, die Genauigkeit liegt bei ca. 10 ms.
 ===== Nachteile =====
-  * Während man bei einer normalen Auswahl die erste Wahl noch korrigieren kann, ist der Klick in der Auswahl-Abfolge endgültig.
+  * Während man bei einer normalen Auswahl die erste Wahl noch korrigieren kann, kann die in einer Auswahlfrage getroffene Auswahl nicht mehr geändert werden.
   * Die Frage sollte alleine auf einer Fragebogen-Seite stehen.
   * Der Fortschrittsbalken verändert sich nicht, während man die Frage ausfüllt.
@@ Zeile 29: / Zeile 31: @@
   * Eine Filterführung zwischen den Teilfragen ist nicht möglich.
   * Die Auswahl-Abfolge benötigt zur korrekten Funktion [[:de:glossary#javascript|JavaScript]]. ist JavaScript deaktiviert, wird eine alternative Darstellung angezeigt und die Reaktionszeitmessung deaktiviert.
+===== JavaScript =====
+Der Container der Frage (die Fragekennung mit einem angehängten ''_qst'', also z.B. ''AB01_qst'' für Frage AB01) löst in aktuellen Browsern ein ''"select"'' Ereignis (Event) aus, wenn eine Option angeklickt wird. Das Ereignis ''"present"'' wird ausgelöst, sobald ein neues Item erscheint.
+Mehr zur Einbindung von JavaScript in den Fragebogen s. [[https://www.soscisurvey.de/help/doku.php/de:create:javascript|JavaScript im Fragebogen]].
+==== Auf Auswahl reagieren ====
+Das Ereignis enthält in `CustomEvent.detail` die Kennung der Frage (''detail.question''), die Nummer der Teilfrage (''detail.item''), den ausgewählten Wert (''detail.value'') und die Antwortzeit (''detail.latency'').
+<code javascript>
+<script type="text/javascript">
+function onSelect(evt) {
+  var info = evt.detail;
+  alert("In Frage " + info.question + " wurde für die Teilfrage " + info.item + " die Option " + info.value + " ausgewählt.");
+}
+var question = document.getElementById("AB01_qst");
+question.addEventListener("select", onSelect);
+</script>
+</code>
+Mittels ''CustomEvent.preventDefault()'' kann die Auswahl unterbunden werden, sodass die Frage die Auswahl des Teilnehmers nicht akzeptiert.
+<code javascript>
+<script type="text/javascript">
+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("AB01_qst");
+question.addEventListener("select", onSelect);
+</script>
+</code>
+==== Audio abspielen beim Erscheinen des Items ====
+Falls man [[:de:create:media#audio-dateien_einbinden|Audiodateien in den Teilfragen verwendet]], funktioniert das automatische Abspielen (''autoplay'') nur leidlich: Beim Laden der Seite werden alle Hörbeispiele auf einmal abgespielt, denn die Teilfragen werden bereits im Hintergrund vorbereitet.
+Hier kann man mit dem ''present'' Ereignis arbeiten und die passende Audio-Datei abspielen, sobald eine Teilfrage erscheint. Für das folgende Beispiel tragen die ''<audio>''-Elemente die HTML-IDs "audio1", "audio2", u.s.w. In der ersten Teilfrage könnte das etwa aussehen wie folgt. Das ''style'' Attribut stellt sicher, dass der Player nicht sichtbar angezeigt wird.
+<code html>
+Hörbeispiel 1
+<audio id="audio1" preload="auto" style="position: absolute; left: -5000px;">
+  <source src="example_moo.mp3" type="audio/mpeg" />
+</audio>
+</code>
+Wie im vorigen Beispiel wird nun eine Funktion definiert, welche auf Basis der Nummer der Teilfrage (''item'') die passende Audio-Datei startet:
+<code javascript>
+<script type="text/javascript">
+function onPresent(evt) {
+  // Die HTML-ID setzt sich aus "audio" und der Nummer der Teilfrage zusammen
+  var item = evt.detail.item;
+  var audio = document.getElementById("audio" + item);
+  if (audio) {
+    audio.play();
+  }
+}
+var question = document.getElementById("AB01_qst");
+question.addEventListener("present", onPresent);
+</script>
+</code>
+==== Teilfragen überspringen ====
+Die JavaScript-Methode ''skipItem()'' erlaubt es, die aktuelle Teilfrage zu überspringen.
+Das folgende Beispiel überspringt eine Teilfrage in der Auswahlabfolge "AA01", wenn die Leertase (Tastencode 32) gedrückt wird.
+<code javascript>
+<script type="text/javascript">
+window.addEventListener("keyup", function(e) {
+    if (e.keyCode == 32){
+        SoSciTools.questionnaire.AA01.skipItem();
+    }
+});
+</script>
+</code>
+Schlagwörter: Auswahlabfolge, Antwortoptionen, Reaktionszeiten.