Fokus auf Textfeld und "Weiter" per Tastendruck

Question

Guten Tag lieber SoSci-Support,

Meine Frage besteht aus 2 Teilen:

1. Die VPN soll eine bestimmte Menge an Aufgaben hintereinander bearbeiten. Die Aufgabe besteht darin ein bestimmtes Wort in ein Textfeld zu schreiben und dann weiter zu drücken. Danach erscheint ein neuer Stimulus bei dem wieder ein Wort aufgeschrieben werden muss.

Ist es möglich, dass bei laden der neuen Seite automatisch das Textfeld "ausgewählt" ist, sodass die VPN direkt reinschreiben kann und nicht erst mit der Maus draufdrücken muss?

1. Der zweite Teil hängt dann mit dem ersten zusammen. Und zwar wäre es gut wenn die VPN nicht mit der Maus auf "weiter" drücken müsste, sondern mit dem drücken der "Enter-Taste" (oder auch einer anderen Taste) zum nächsten Stimulus gelangen könnte. Ist das möglich?

Viele Grüße und Danke!
A. Ventura

Answer 1

Ist es möglich, dass bei laden der neuen Seite automatisch das Textfeld "ausgewählt" ist, sodass die VPN direkt reinschreiben kann und nicht erst mit der Maus draufdrücken muss

Natürlich ... setzen Sie an das Ende der Seite folgenden HTML /JavaScript-Code:

<script type="text/javascript">
document.getElementById("TX01_01").focus();
</script>

Die Kennung TX01_01 müssen Sie jeweils durch die Kennung des Texteingabefelds ersetzen. Wenn Sie eine größere Anzahl Aufgaben/Eingabefelder haben, dann könnte man das Eingabefeld per JavaScript auch automatisch suchen.

Und zwar wäre es gut wenn die VPN nicht mit der Maus auf "weiter" drücken müsste, sondern mit dem drücken der "Enter-Taste" (oder auch einer anderen Taste) zum nächsten Stimulus gelangen könnte.

Standardmäßig ist das unter Fragebogen zusammenstellen -> Einstellungen explizit blockiert, um ein versehentliches Abschicken der Seite zu verhindern.

Sollte es nicht ausreichen, die Funktion zu deaktivieren, dann finden Sie hier noch eine explizite Lösung: Leertaste einstellen - der Tastencode (keycode) für die Eingabetaste ist 13.

Comments

Danke für die Antwort.

Das absender der Seite per Tastendruck funktioniert und in einem Beispiel mit nur einem festen Eingabefeld funktioniert auch das fokussieren.

An einer anderen Stelle ist zufällig ein Feld mit der Kennung AW01_01 bis AW39_01 auszuwählen, deswegen habe ich das versucht mit JavaScript automatisch zu suchen, so wie sie vorgeschlagen haben. Nur leider habe ich noch nie mit JS gearbeitet und es funktioniert leider nicht.

Es wäre super wenn Sie mir nochmals helfen könnten.


Ich hatte es mit folgenden Code probiert:
Die passende Frage wähle ich mithilfe von PHP aus, was auch funktioniert:

 // Die passende Frage-Kennung erstellen und die Frage mittels question() anzeigen
 question(id('AW', $i + 1)); // Frage-Kennungen AW01 bis AW39

Highlighten mithilfe von HTML/JS funktioniert nicht:

<script type="text/javascript">
var regex = g/AW\d\d_01/
document.getElementById(regex.toString()).focus();
</script>

---

Reguläre Ausdrücke sind (v.a.) dazu da, in einem text etwas zu suchen - zufällig etwas passendes erfinden ist nicht ihre Stärke.

Wenn Sie zufällig etwas auswählen möchten, dann verwenden Sie einen Zufallsgenerator und setzen Sie die gezogene Kennung per replace() und Platzhalter in den JavaScript-Code ein. In der Anleitung zur Randomisierung finden Sie passende Code-Beispiele.

---

Entschuldigung, ich habe mich vielleicht nicht genau genug ausgedrückt. Dann versuch ich nochmal ganz ausführlich:

Ich nutze den folgenden Code, den ich aus dem Artikel "Zufallsgenerator" entnommen habe, um 39 Bildstimuli (mit einem Zufallsgenerator randomisiert) nacheinander auf der gleichen Seite anzuzeigen. Zu jedem Bildstimulus wird ein Texteingabefeld mit der passenden Kennung (AW01_01-AW39-01) angezeigt. Das Funktioniert auch alles ganz wunderbar.

PHP-Code:
// loopPage(39) liefert eine Zahl von 0 bis 39 (eins mehr bei jeder Wiederholung)
$i = loopPage(39);  // Hier die Zahl der zu zeigenden Bilder eintragen
// Das ausgewählte Bild anzeigen
$varID = 'ZW01x'.sprintf('%02d', $i + 1);  // Die Variablennamen lauten ZW01x01 bis ZW01x39
$img = value($varID, 'label');
// Das HTML-Tag <img> zeigt ein Bild an, der Dateiname wird mit src angegeben
html('
  <div style="margin:  margin: 20px 0; text-align: center">
    <img src="'.$img.'" alt="" />
  </div>
');
// Die passende Frage-Kennung erstellen und die Frage mittels question() anzeigen
question(id('AW', $i + 1)); // Frage-Kennungen AW01 bis AW39


Nun bräuchte ich ein Script was bei jedem Seitenaufruf automatisch das Texteingabefeld erkennt, unabhängig davon welche Kennung gerade angezeigt wird, und es Highlightet, sodass die VP direkt reinschreiben können.

---

Jetzt wird es klarer, danke :)

question(id('AW', $i + 1)); // Frage-Kennungen AW01 bis AW39
replace('%frageID%', id('AW', $i + 1));

Wenn Sie dieses replace() ergänzen, können den den Platzhalter %frageID% einfach im JavaScript-Code einsetzen.

---

Vielen Dank!
Jetzt funktioniert alles wie es soll.