Hallo Joachim,

ich bin im Moment sehr ausgelastet und konnte daher nicht weiter auf Dich eingehen.

Ist das hier der Link zu deinem aktuellen Arbeitsstand?
https://joafroehlich.github.io/MaTest/Test1.html

Ich habe Dir gesagt, dass Grid-Items direkte Kindelemente des Grid-Containers sein müssen. In Aufgabe 1 ist Dir das </label> Tag verrutscht, darum funktioniert das Grid dort nicht.

Ich hatte auch text-align:right für's label gesetzt. Das hast Du nicht übernommen, dadurch steht "Versuch" und Eingabefeld links. War das Absicht?

Und warum hast Du in Aufgabe 1 für die Lösung einen Button genommen, den Du mit Script zum Jagen tragen musst? Ein Link öffnet das PDF eigenständig. Die Styles, die Link und Button gleich aussehen lassen, hast Du doch übernommen. Und in Aufgabe 2 hast Du meinen Vorschlag behalten, da siehst Du, wie Link und Button gleich aussehen.

Du verwendest auf deinen Aufgabenseiten Aufgaben ohne überprüfte Lösung. Wieso eigentlich?

Du verwendest Script zum Öffnen der Eingabefelder. Unnötig. Du verwendest Script zum Öffnen der Lösungs-PDFs. Unnötig.

Script braucht man zum Verifizieren der Eingaben. Und zwar genau eins, das alle Eingabefelder gemeinsam behandelt und über data-Attribute seine Informationen bekommt.

Wenn Du UNBEDINGT die Eingabefelder per Button freischalten willst, dann ist das erste, was 'rein muss, ein aria-controls Attribut am Button. Damit ist (a) die Zugänglichkeit gewahrt und (b) kann ein zentrales Script bei einem Klick auf einen Button mit aria-controls-Attribut und vielleicht noch name="einschalten" oder so dafür sorgen, dass das über aria-controls angegebene Eingabefeld freigegeben wird.

<form class="aufgabe" name="aufgabe_1">
  <h2>
    <button name="einschalten" aria-controls="Eintrag1">Aufgabe 1</button> 
  </h2>
  <p class="text">...</p>
  <label class="versuch">
    Ihr Ergebnis:
    <input type="text" id="Eintrag1" data-lösung="1234" disabled>
  </label>
  <button name="verify">Prüfen</button>
  <a href="..." target="_blank">Lösung</a>
</form>

Ob "Eintrag1" eine ideale ID ist, beweifle ich, aber Hauptsache ist, dass sie eindeutig ist.

Dem disabled-Attribut gibt man nicht "true" als Wert. Wenn überhaupt, dann disabled="disabled", aber das ist XHTML und für Dich wohl uninteressant. Im JavaScript ist das was anderes, da weist man true oder false zu, aber nicht an das disabled-Attribut (das ist HTML), sondern an die disabled-Eigenschaft des JavaScript-Objekts, das für das input-Element steht. Die beiden Dinger heißen gleich und sie sind unter der Haube gekoppelt, aber sie sind nicht das Gleiche. Weise ich in JavaScript an die disabled-Eigenschaft false zu, verschwindet das disabled-Attribut aus dem DOM. Weise ich true zu, erscheint das Attribut wieder. Im Seiteninspektor (kennst Du den?) sieht man das.

Bei dem oben gezeigten HTML kann man das so scripten:

document.body.addEventListener("click", function(clickEvent) {
   // Buttons können HTML enthalten, mit closest findet man den Button selbst
   const button = clickEvent.target.closest("button");
   // button kann null oder was anderes sein, wenn anderswohin geklickt wurde
   // Dann einfach wieder raus. That's not the Button you're looking for! ✋
   if (!(button instanceof HTMLButtonElement)) return;

   // Das Eingabeelement für die Aufgabe suchen. Erstmal hoch zum form-Element,
   // von da aus das input type="text" aufsuchen.
   const aufgabe = button.closest("form").querySelector("input[type=text]");
   // Nicht da - dann tschüs.
   if (aufgabe == null) return;

   // Wir interessieren uns für die Buttons mit Name "einschalten" und
   // "verify". Jeder Button hat eigene Logik
   if (button.name == "einschalten") {
      aufgabe.disabled = false;
   }
   else if (button.name == "verify" && aufgabe.hasAttribute("data-lösung")) {
      const lösung = aufgabe.dataset.lösung;
      if (parseFloat(aufgabe.value) == parseFloat(lösung)) {
        // Richtig
      }
      else {
        // Falsch
      }
   }
}

Dieses Script behandelt vollautomatisch das Einschalten und das Überprüfen für alle Aufgaben. Es ist allerdings überfordert, wenn mehrere Eingaben richtig sind, sowas hast Du ja auch drin, wenn je nach Rechenweg unterschiedliche Rundungen zu gleichen Ergebnissen führen. Für die allermeisten Eingabefelder sollte das aber hinreichen. Wenn es mehr als eine richtige Lösung gibt, wäre mein Vorschlag, im data-lösung Attribut mehrere Werte einzutragen, z.B.

data-lösung="12.3|12.35"

das mit split zu zerlegen und die Werte der Reihe nach zu prüfen. Aber darauf gehe ich nur ein, wenn Dich das überhaupt interessiert und Du nicht bei deiner "Eine Aufgabe, Ein Script" Idee bleiben willst.

Rolf