Compare commits
2 Commits
ad8114a31b
...
44623ba94e
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
44623ba94e | ||
|
|
810a541924 |
24
Zweites Jahr/javascript/htmlformular/htmlformular.html
Normal file
24
Zweites Jahr/javascript/htmlformular/htmlformular.html
Normal file
@@ -0,0 +1,24 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en"><head>
|
||||||
|
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
|
||||||
|
<title>Document</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<form>
|
||||||
|
<div>
|
||||||
|
<label for="name">Name:</label>
|
||||||
|
<input type="text" id="name" name="name">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label for="adresse">adresse:</label>
|
||||||
|
<input type="text" id="adresse" name="adresse" oninput="laenge()">
|
||||||
|
<p id="platzhalter"></p>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
<script src="htmlformular_files/script.js"></script>
|
||||||
|
|
||||||
|
</body></html>
|
||||||
@@ -0,0 +1,30 @@
|
|||||||
|
const x =5;//const ist eine permanente Variable die nicht verändert werden kann
|
||||||
|
let y = 4;//mit let definieren wir Variablen die noch verändert werden können
|
||||||
|
|
||||||
|
//alert wird jedesmal ausgegeben wenn javascript geladen wurde
|
||||||
|
alert("JAVASCRIPT FUNKTIONIERT");
|
||||||
|
|
||||||
|
|
||||||
|
const feld1 = document.getElementById("name");
|
||||||
|
feld1.addEventListener("input", function(){
|
||||||
|
if(feld1.value.length > 4){
|
||||||
|
feld1.style.backgroundColor="green";
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
feld1.style.backgroundColor="red";
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
function laenge(){
|
||||||
|
const feld2 = document.getElementById("adresse");
|
||||||
|
// feld2.innerHTML="not long enaugh";
|
||||||
|
feld2.addEventListener("input", function(){
|
||||||
|
if(feld2.value.length > 4){
|
||||||
|
feld2.style.backgroundColor="green";
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
feld2.style.backgroundColor="red";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)}
|
||||||
Reference in New Issue
Block a user