Javascript läßt sich nicht auslagern von Matthias, 07.03.2024 18:29

Javascript läßt sich nicht auslagern

Matthias 07.03.2024 18:29

Hallo,

Ich habe einen Code geschrieben, der mir eine Anzeigt wenn eine Checkbox aktiviert wird. Das klapt auch soweit ganz gut, nur wenn ich das <script> in die Datei 'boxentest.js' auslagere funktioniert das ganze nicht mehr. (Ja die beiden Dateien liegen im selben Ordner!!) Was mache ich also falsch?

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <script src="boxentest.js"></script>
  <meta name="viewport" content="width=device-width">
  <title>Test</title>
</head>
<body>
  <tr>
<td> Rand: <input type="checkbox" id="s1" value="Rand"> </td>
<td> Schatten: <input type="checkbox" id="s2" value="Schatten"> </td>
<td> Steg: <input type="checkbox" id="s3" value="Steg"> </td>
</tr>
  <p id="box1"></p>
  <p id="box2"></p>
  <p id="box3"></p>  
  
<script>
document.getElementById("s1").addEventListener("change", function() {
  if(this.checked) {
    document.getElementById("box1").innerHTML = "Rand ist aktiviert!";
  } else {
    document.getElementById("box1").innerHTML = "";
  }
});

document.getElementById("s2").addEventListener("change", function() {
  if(this.checked) {
    document.getElementById("box2").innerHTML = "Schatten ist aktiviert!";
  } else {
    document.getElementById("box2").innerHTML = "";
  }
});

document.getElementById("s3").addEventListener("change", function() {
  if(this.checked) {
    document.getElementById("box3").innerHTML = "Steg ist aktiviert!";
  } else {
    document.getElementById("box3").innerHTML = "";
  }
});
</script>

</body>
</html>