You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
55 lines
2.0 KiB
JavaScript
55 lines
2.0 KiB
JavaScript
// projekte.js
|
|
|
|
document.addEventListener("DOMContentLoaded", function() {
|
|
// Das DOM ist vollständig geladen
|
|
|
|
// Elemente aus dem DOM abrufen
|
|
var projektForm = document.getElementById("projekt-form");
|
|
var projektNameInput = document.getElementById("projekt-name");
|
|
var projekteListe = document.getElementById("projekte-liste");
|
|
var projektHinzufuegen = document.getElementById("projekt-hinzufuegen");
|
|
|
|
// Eventlistener für das Hinzufügen von Projekten hinzufügen
|
|
projektHinzufuegen.addEventListener("click", function(event) {
|
|
event.preventDefault(); // Standardformularverhalten verhindern
|
|
|
|
// Den eingegebenen Projektname auslesen
|
|
var projektName = projektNameInput.value;
|
|
|
|
// Überprüfen, ob der Projektname nicht leer ist
|
|
if (projektName.trim() !== "") {
|
|
// Ein neues Listenelement erstellen
|
|
var neuesProjekt = document.createElement("li");
|
|
|
|
// Ein Link-Element für das Projekt erstellen
|
|
var projektLink = document.createElement("a");
|
|
projektLink.href = "projekt/" + projektName.toLowerCase() + ".html"; // Verweisziel für das Projekt
|
|
projektLink.textContent = projektName;
|
|
|
|
// Das Link-Element zur Liste hinzufügen
|
|
neuesProjekt.appendChild(projektLink);
|
|
|
|
// Das Minus-Symbol hinzufügen
|
|
var minusSymbol = document.createElement("span");
|
|
minusSymbol.textContent = "-";
|
|
minusSymbol.classList.add("remove-symbol");
|
|
neuesProjekt.appendChild(minusSymbol);
|
|
|
|
// Das neue Listenelement zur Projekte-Liste hinzufügen
|
|
projekteListe.appendChild(neuesProjekt);
|
|
|
|
// Das Projektname-Eingabefeld leeren
|
|
projektNameInput.value = "";
|
|
}
|
|
});
|
|
|
|
// Eventlistener für das Entfernen von Projekten hinzufügen
|
|
projekteListe.addEventListener("click", function(event) {
|
|
var clickedElement = event.target;
|
|
if (clickedElement.classList.contains("remove-symbol")) {
|
|
var projektElement = clickedElement.parentNode;
|
|
projekteListe.removeChild(projektElement);
|
|
}
|
|
});
|
|
});
|