[GELÖST] click(function() und replaceWith mehrmals ausführen

[JackPott]

Oh man, natürlich hast du recht. Da habe ich mich aber auch dusselig angestellt. Anstatt alles zu kombinieren, hatte ich versucht, die nächste Abfrage in einen neuen setTimeout zu packen, was nicht funktionierte. Vielen Dank für den Anstoß!

 

[kkapsner]

Vielen Dank für den Anstoß!

Bitte - gern geschehen.

 

[JackPott]

Es geht voran! Das Quiz ist soweit fertig. Nun beschäftige ich mit anderen Fragearten. Derzeit geht es darum, dass ein Lösungswort eingegeben werden muss. Das ist soweit auch kein Problem (ich nutze einfach denselben Code). Mein Formular sieht dann so aus:

<form action="validate.php" method="post">
<input name="antwort">
<input type="hidden" name="richtig" "aaa">
</form>

Das schöne ist, dass der o.g. Ajax-Code bereits mit dem Drücken der Enter-Taste umgehen kann und die Anfrage korrekt verarbeitet. Jetzt schwebt mir aber vor, dass beim Tippen schon geprüft wird, ob das Wort stimmt. D.h., falls jemand die Lösung korrekt eingegeben hat, sollte ohne Drücken der Enter-Taste die nächste Frage angezeigt werden.

Dazu muss ich mit keyup arbeiten, weiß allerdings nicht, wie ich beides kombinieren kann. Sollte der Nutzer nämlich etwas Falsches eingeben, muss beim Drücken von Enter das Skript weiterhin funktionieren. Habt ihr wieder einen Ratschlag?

Hier noch kurz der Test-Schnipsel:

<form action="validate.php" method="post">
<input name="antwort">
<input type="hidden" name="richtig" value="aaa">
</form>
<script>
$("form").submit(function(event) {
    // Das eigentliche Absenden verhindern
    event.preventDefault();

    // Das sendende Formular und die Metadaten bestimmen
    var form = $(this); // Dieser Zeiger $(this) oder $("form"), falls die ID form im HTML exisitiert, klappt übrigens auch ohne jQuery ;)
    var action = form.attr("action"), // attr() kann enweder den aktuellen Inhalt des gennanten Attributs auslesen, oder setzt ein neuen Wert, falls ein zweiter Parameter gegeben ist
        method = form.attr("method"),
        data   = form.serialize();

    // Der eigentliche AJAX Aufruf
    $.ajax({
        url : action,
        type : method,
        data : data
    }).done(function (data) {
         var riAntwort = $('input[type="hidden"]').val();
         if(data == riAntwort) {
                 $("form").replaceWith('Richtig');
                 }
        else {
                 $("form").replaceWith('Falsch');
                 }



             });
    });
         </script>

 

[paul schmitz]

Willst du das wirklich? Dann kann man ja einfach rumprobieren, bis es passt.
Zur Lösung:
- Beim Druck von Enter (submit vom Formular) wird "Falsch" angezeigt. Nimm also den Prüfungscode weg, und ersetze es durch einen, der nur falsch anzeigt. Richtige Antworten werden über den onkeyup-Code weitergeschoben, sodass hier nur die falschen ankommen.
- hinzu kommt ein EventHandler für onkeyup (.keyup() | jQuery API Documentation). Dieser prüft dann so, wie du es jetzt schon tust. Kopiere also einfach deinen jetzigen Prüfungscode dort hinein.