addEventListener

[Hartmut Kroos]

Hallo allerseits! Das gute Stück hat mir nach einem Tip in diesem Forum weitergeholfen, aber jetzt hänge ich fest. Ich möchte einen Event nur an bestimmte, benannte Links anhängen, was auch gut funktioniert, auch die erwünschten Änderungen werden durchführt (Es muß ein zusätzliches Datum zum Formular.) Der anschließend vorgesehene Formularaufruf findet aber nicht statt :-( Hat jemand eine Idee, was ich falsch mache?

      var x = document.getElementsByName("Linked");
      var i;
      for (i = 0; i < x.length; i++) {
        x[i]
        .addEventListener("click", function(){
          Auswahl = event.target.id;
          if (Auswahl.substr(0, 4) == "disc") Auswahl = Auswahl.substr(4,Auswahl.length);
          document.getElementById("Auswahl").value = Auswahl;
          event.target.form.submit();
        });
      }

[JürgenB]

Hallo

      event.target.form.submit();

ich gehe mal davon aus, dass bei Klick auf einen Link das target kein Formular ist. Kommt da irgendeine Meldung in der Konsole?

Gruß
Jürgen

[Der Martin]

Hallo Jürgen,

          event.target.form.submit();

ich gehe mal davon aus, dass bei Klick auf einen Link das target kein Formular ist.

das vielleicht nicht, aber vielleicht hat Hartmut nur ungenau formuliert und es sind gar keine Links, sondern Formularelemente, die ihrerseits wieder eine form-Eigenschaft haben - eine Referenz auf das übergeordnete Formular.

Kommt da irgendeine Meldung in der Konsole?

Wenn's so ist, wie ich gerade skizziert habe - warum sollte? 😉
Aber tatsächlich wäre es hilfreich, das zugehörige Markup zu sehen.

Live long and pros healthy,
 Martin

[dedlfix]

Tach!

Hat jemand eine Idee, was ich falsch mache?

Dein Event Listener greift auf etwas namens event zu. Wo kommt das her und ist da das drin, was du erwartest? Generell ist zu sagen, dass die Browser eingebaute Debugger haben und du mit denen genau Wunsch und Wirklichkeit vergleichen kannst, und somit auch die Stellen, an denen Abweichungen bestehen. Ich kann mir auch gut vorstellen, dass Fehlermeldungen in der Console erscheinen.

dedlfix.

[Hartmut Kroos]

Die Seite ist zurzeit nur eine aufwändige private Spielerei, aber es wäre schon schön, wenn sie liefe. Bitte ruft einmal http://kroos.eu/Schnoor auf. Ein Klick auf das Windlicht und später dann beispielsweise auf „Lokales“, um das Formular aufzurufen, zeigt, worauf ich hinaus will. Vielleicht gibt es aber auch eine ganz andere Lösung.

[dedlfix]

Tach!

Bitte ruft einmal kroos.eu/Schnoor auf. Ein Klick auf das Windlicht

Erst mal können, wenn die ganze Zeit irgendwas davor herumfliegt. Und wie gesagt, Debugger nutzen hilft weiter. Da kommen Fehlermeldungen in der Konsole.

event steht magischerweise zur Verfügung. Normalerweise holt man es sich aus den Parametern der Eventhandler-Funktion. Beim Untersuchen im Debugger könnte man sehen, dass event.target ein img-Element ist, und das hat keine Eigenschaft namens form, weswegen man von diesem undefined kein submit() aufrufen kann.

dedlfix.

[Matthias Scharwies]

Servus!

Tach!

Bitte ruft einmal kroos.eu/Schnoor auf. Ein Klick auf das Windlicht

Erst mal können, wenn die ganze Zeit irgendwas davor herumfliegt. Und wie gesagt, Debugger nutzen hilft weiter. Da kommen Fehlermeldungen in der Konsole.

MDN: Tools/Debugger

SELF-Wiki: JavaScript/Tutorials/Einstieg

Herzliche Grüße

Matthias Scharwies

[Hartmut Kroos]

Die Flugobjekte wollte ich nicht extra abschalten, aber wenn ich das richtig verstehe, ist mein Lösungsansatz eine Sackgasse?

[dedlfix]

Tach!

aber wenn ich das richtig verstehe, ist mein Lösungsansatz eine Sackgasse?

Man kann von Formular-Elementen über die Eigenschaft form zum Form navigieren, ein img ist aber kein Formelement und hat eine solche Eigenschaft nicht.

dedlfix.

[Rolf B]

Hallo Hartmut,

Hat jemand eine Idee, was ich falsch mache?

Schon. Es ist ziemlich viel.

Primärproblem: <img> Elemente sind nicht interaktiv. Einen click-Handler auf ein img oder figure Element zu registrieren macht es klickbar, aber nicht bedienbar. Diese Elemente müssen Buttons werden.

Ein Button ist ein Form-Element und hat eine form Eigenschaft. Die kannst Du dann auch verwenden. Ein Image ist kein Form-Element und hat deshalb auch keine form-Eigenschaft.

Mit Buttons hast Du auch das Problem der Bedienbarkeit reduziert. Man kann nun mit Tastatur von Element zu Element springen. Die Infos gehen deswegen aber trotzdem nicht auf, weil Du auf :hover reagierst. Für Tastaturbedienung musst Du auf :focus reagieren.

Das größte Bedienproblem sind diese herumeiernden Buttons. Wer gesund ist und keine Probleme mit seiner Beweglichkeit hat, erwischt einen davon. Lass deinen Vater (oder Großvater) die Seite ausprobieren, und sie werden Dich verfluchen. Bedienelemente, die vor dem Bediener flüchten, sind ein absolutes no-go.

Und jetzt habe ich Self-Stammtisch und mache erstmal Schluss... Wer nicht im Verein ist und teilnehmen möchte: Jederzeit gerne, schaut nach dem gepinnten Einladungs-Thread. Ihr braucht Discord.

Rolf