This commit is contained in:
63
01_grundlagen/uebungen/u23_validierung-prompt.html
Normal file
63
01_grundlagen/uebungen/u23_validierung-prompt.html
Normal file
@@ -0,0 +1,63 @@
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Übung 23: Von guten und bösen Eingaben</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet" />
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<div class="container py-5">
|
||||
<div class="alert alert-primary">
|
||||
<h2>Übung 23: Von guten und bösen Eingaben</h2>
|
||||
<ol class="list">
|
||||
<li>
|
||||
Nimm Angaben zu Vorname, Nachname, Alter und dem liebsten Heißgetränk eines Anwenders entgegen und
|
||||
speichere diese in Variablen.
|
||||
</li>
|
||||
<li>
|
||||
Diese Eingaben sollst du nun folgendermaßen validieren:
|
||||
<ul class="list">
|
||||
<li>Vorname und Nachname müssen zwischen 2 und 100 Zeichen lang sein.</li>
|
||||
<li>Das Alter muss eine Zahl unter 150 sein.</li>
|
||||
<li>Die Eingabe für das Getränk muss c (coffee) oder t (tea) sein.</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
<div class="output alert alert-secondary my-3"></div>
|
||||
</div>
|
||||
</main>
|
||||
<script>
|
||||
'use strict';
|
||||
const outputEl = document.querySelector('.output');
|
||||
// Aufgabe
|
||||
const firstName = prompt('Wilkommen. Wie heißen Sie mit Vornamen?');
|
||||
const lastName = prompt('Und mit Nachnamen??');
|
||||
const age = Number(prompt('Geben Sie ihr Alter an:'));
|
||||
const favoriteHotDrink = prompt('Und was ist ihr liebstes Heißgetränk??? (k (Kaffee) | t (Tee)').toLowerCase();
|
||||
|
||||
let errorMsg = '';
|
||||
|
||||
if (firstName.length < 2 || firstName.length > 100) {
|
||||
errorMsg += 'Der Vorname muss zwischen 2 und 100 Zeichen lang sein!\n';
|
||||
}
|
||||
if (lastName.length < 2 || lastName.length > 100) {
|
||||
errorMsg += 'Der Nachname muss zwischen 2 und 100 Zeichen lang sein!\n';
|
||||
}
|
||||
if (age >= 150 || age <= 0) {
|
||||
errorMsg += 'Das Alter muss unter 150 liegen und über 0 liegen\n';
|
||||
}
|
||||
if (favoriteHotDrink !== 'k' && favoriteHotDrink !== 't') {
|
||||
errorMsg += 'Bitte Kaffee mit k und Tee mit t eingeben!\n';
|
||||
}
|
||||
|
||||
if (errorMsg === '') {
|
||||
outputEl.textContent = '<p>Alle Eingaben sind korrekt!</p>';
|
||||
} else {
|
||||
outputEl.innerHTML = errorMsg.replaceAll('\n', '<br />');
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user