Hey zusammen,
ich habe mal einen Lückentext erstellt. Funktioniert soweit auch alles.
Aber ich möchte dazu noch das wenn ein richtiges Wort eingetragen wird in der Zeile Fehlende Wörter das wort durchgestrichen wird, und bei Fehlern, das input feld einen roten border bekommt.
Beispiel:
Ich fülle jetzt den Lückentext aus und klick absenden, und alle richtig sind sollen alle durchgestrichen werden, und bei fehlern die fehlerhaften wörter nicht durchgestrichen werden und ein roter border um fehlerhafte input felder soll erscheinen
Wie kann man es machen?
Anbei meine Datei:
PHP
<?php
error_reporting(E_ALL);
if(isset($_POST['abgesendet'])){
if(isset($_POST['rotkaepchen'])){
$wort1 = $_POST['rotkaepchen'];
} else{
$wort1 = null;
}
if(isset($_POST['mutter'])){
$wort2 = $_POST['mutter'];
} else{
$wort2 = null;
}
if(isset($_POST['weg'])){
$wort3 = $_POST['weg'] ;
} else{
$wort3 = null;
}
if(isset($_POST['wolf'])){
$wort4 = $_POST['wolf'];
} else{
$wort4 = null;
}
if(isset($_POST['blumenstrauß'])){
$wort5 = $_POST['blumenstrauß'];
} else{
$wort5 = null;
}
if(isset($_POST['großmutter'])){
$wort6 = $_POST['großmutter'];
} else{
$wort6 = null;
}
if(isset($_POST['großmutters'])){
$wort7 = $_POST['großmutters'];
} else{
$wort7 = null;
}
if(isset($_POST['gestalt'])){
$wort8 = $_POST['gestalt'];
} else{
$wort8 = null;
}
if(isset($_POST['jaeger'])){
$wort9 = $_POST['jaeger'];
} else{
$wort9 = null;
}
if(isset($_POST['steine'])){
$wort10 = $_POST['steine'];
} else{
$wort10 = null;
}
$ltw1 = "Rotkäppchen";
$ltw2 = "Mutter";
$ltw3 = "Weg";
$ltw4 = "Wolf";
$ltw5 = "Blumenstrauß";
$ltw6 = "Großmutter";
$ltw7 = "Großmutters";
$ltw8 = "Gestalt";
$ltw9 = "Jäger";
$ltw10 = "Steine";
if ($_POST['rotkaepchen'] === $ltw1 and
$_POST['mutter'] === $ltw2 and
$_POST['weg'] === $ltw3 and
$_POST['wolf'] === $ltw4 and
$_POST['blumenstrauß'] === $ltw5 and
$_POST['großmutter'] === $ltw6 and
$_POST['großmutters'] === $ltw7 and
$_POST['gestalt'] === $ltw8 and
$_POST['jaeger'] === $ltw9 and
$_POST['steine'] === $ltw10
) {
$ausgabe1 = "Sie haben den Lückentext richtig ausgefüllt, ohne Fehler.";
} else{
$ausgabe1 = null;
}
if ($_POST['rotkaepchen'] !== $ltw1 ) {
$ausgabe2 = "Fehler im 1 Kasten";
} else{
$ausgabe2 = null;
}
if ($_POST['mutter'] !== $ltw2) {
$ausgabe3 = "<br>Fehler im 2 Kasten";
} else{
$ausgabe3 = null;
}
if ($_POST['weg'] !== $ltw3 ) {
$ausgabe4 = "<br>Fehler im 3 Kasten";
} else{
$ausgabe4 = null;
}
if ($_POST['wolf'] !== $ltw4 ) {
$ausgabe5 = "<br>Fehler im 4 Kasten";
} else{
$ausgabe5 = null;
}
if ($_POST['blumenstrauß'] !== $ltw5 ) {
$ausgabe6 = "<br>Fehler im 5 Kasten";
}else{
$ausgabe6 = null;
}
if ($_POST['großmutter'] !== $ltw6 ) {
$ausgabe7 = "<br>Fehler im 6 Kasten";
}else{
$ausgabe7 = null;
}
if ($_POST['großmutters'] !== $ltw7) {
$ausgabe8 = "<br>Fehler im 7 Kasten";
}else{
$ausgabe8 = null;
}
if ($_POST['gestalt'] !== $ltw8 ){
$ausgabe9 = "<br>Fehler im 8 Kasten";
} else{
$ausgabe9 = null;
}
if ($_POST['jaeger'] !== $ltw9) {
$ausgabe10 = "<br>Fehler im 9 Kasten";
}else{
$ausgabe10 = null;
}
if ($_POST['steine'] !== $ltw10) {
$ausgabe11 = "<br>Fehler im 10 Kasten";
}else{
$ausgabe11 = null;
}
$arr = array ($ausgabe1,$ausgabe2,$ausgabe3,$ausgabe4,$ausgabe5,$ausgabe6,$ausgabe7,$ausgabe8,$ausgabe9,$ausgabe10,$ausgabe11);
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Lückentext</title>
<style type="text/css">
* {
margin: 0px;
padding: 0px;
font-family: Verdana,sans-serif;
}
h1{
margin-bottom: 10px;
}
main{
width: 1000px;
margin: 40px auto;
background-color: rgba(73, 149, 156, 0.78);
padding: 20px;
border: 2px solid black;
border-radius: 30px;
box-shadow: 2px 2px 4px black;
}
p{
line-height: 30px;
}
p.woerter{
margin-top: 15px;
border: 1px solid black;
padding: 2.5px;
background-color: yellow;
text-align: center;
}
input[type='text']{
padding: 2.5px;
}
input[type='submit']{
padding: 20px;
margin-top: 15px;
transition: 1s;
border: none;
}
div#phpausgabe{
margin-top: 10px;
color: red;
}
input[type='submit']:hover
{
background-color: gold;
cursor: pointer;
box-shadow: 0px 2px 5px black;
}
</style>
</head>
<body>
<main>
<h1>Lückentext</h1>
<form method="post">
<p>Ein kleines Mädchen, <input type="text" name="rotkaepchen" <?php if(isset($wort1)) print ($wort1 == $ltw1) ? 'value="'. $wort1 .'"' : ""; ?>>, dem seine Großmutter einst eine rote Kappe geschenkt hat, wird von der <input type="text" name="mutter" <?php if(isset($wort2)) print ($wort2 == $ltw2) ? 'value="'. $wort2 .'"' : ""; ?> > geschickt, der in einem Haus im Wald wohnenden, bettlägerig kranken Großmutter einen Korb mit Leckereien (Kuchen und Wein) zu bringen. Die Mutter warnt Rotkäppchen eindringlich, es solle nicht vom <input type="text" name="weg" <?php if(isset($wort3)) print ($wort3 == $ltw3) ? 'value="'. $wort3 .'"' : ""; ?>> abgehen. Im Wald lässt es sich auf ein Gespräch mit einem <input type="text" name="wolf" <?php if(isset($wort4)) print ($wort4 == $ltw4) ? 'value="'. $wort4 .'"' : ""; ?>> ein. Dieser horcht Rotkäppchen aus und macht es auf die schönen Blumen auf einer nahen Wiese aufmerksam, worauf Rotkäppchen beschließt, noch einen <input type="text" name="blumenstrauß"<?php if(isset($wort5)) print ($wort5 == $ltw5) ? 'value="'. $wort5 .'"' : ""; ?>> zu pflücken, der Warnung der Mutter zum Trotz. Der Wolf eilt geradewegs zur <input type="text" name="großmutter" <?php if(isset($wort6)) print ($wort6 == $ltw6) ? 'value="'. $wort6 .'"' : ""; ?>> und frisst sie. Er legt sich in deren Nachthemd in ihr Bett und wartet auf Rotkäppchen. Bald darauf erreicht Rotkäppchen das Haus, tritt ein, und begibt sich an <input type="text" name="großmutters" <?php if(isset($wort7)) print ($wort7 == $ltw7) ? 'value="'. $wort7 .'"' : ""; ?>> Bett. Dort wundert sich Rotkäppchen über die <input type="text" name="gestalt" <?php if(isset($wort8)) print ($wort8 == $ltw8) ? 'value="'. $wort8 .'"' : ""; ?>> ihrer Großmutter, erkennt aber nicht den Wolf, bevor es ebenfalls gefressen wird.Großmutter und Rotkäppchen werden aber von einem <input type="text" name="jaeger" <?php if(isset($wort9)) print ($wort9 == $ltw9) ? 'value="'. $wort9 .'"' : ""; ?>> aus dem Bauch des Wolfes befreit. Der Jäger füllt dem Wolf <input type="text" name="steine" <?php if(isset($wort10)) print ($wort10 == $ltw10) ? 'value="'. $wort10 .'"' : ""; ?>> in den Bauch. Wegen des Gewichts der Steine kann der Wolf nicht fliehen und stirbt.
</p>
<p class="woerter"> Fehlende Wörter : Rotkäppchen, Weg, Mutter, Blumenstrauß, Jäger, Großmutters, Gestalt, Wolf, Steine, Goßmutter</p>
<input type="submit" name="abgesendet" value="Lückentext absenden!">
</form>
<div id="phpausgabe">
<?php
if(isset($arr)){
for ($i = 0; $i <sizeof($arr); $i++ ) {
print $arr[$i];
}
}
?>
</div>
</main>
</body>
</html>Gruß,
Stef
