Mehrere inputs auf einmal vergleichen mit Javascript?

Ich habe mehrere Input-Elemente mit der selben id. Ich möchte die Eingaben dieser Input Elemente auf einmal zu vergleichen (bin zu faul jedem Element eine eigene id zu geben und die alle einzeln zu vergleichen) gibt es da eine Möglichkeit?

Ich möchte also erreichen, dass wen eines der eingegebenen Sachen mit dem vorgegebenen Wert übereinstimmt die Sache gemacht wird.

if(Die Sache die ich nicht weiß == "text"){
}

Hat jemand Ideen?

Hoffe auf Antworten,

-Bohne47

Answer 1

[Baerenheini]

Einfach mit einer ForEach-schleife:

const all_inputs = document.querySelectorAll('#deineId');
all_inputs.forEach((input)=>{
  //hier kannst du dann deine If-abfrage pro input machen
});

Comments

[Bohne47]

Dankeschön für deine sehr ve<rständlich erklärte Antwort.

Answer 2

[Zwnow]

Quick & Dirty funktioniert sowas z.B.:

    <input type="text">
    <input type="text">
    <input type="text">
    <input type="text">


    <script>
        let inputs = document.querySelectorAll("input");
        inputs.forEach(function(input){
            input.addEventListener("input", function(e){
                if(e.target.value === "Test")
                    alert("Funzt");
            });
        });
    </script>

"zu faul" ist allerdings eine extrem schlechte Eigenschaft wenn's ums Programmieren geht...

Woher ich das weiß: Berufserfahrung – Ich bin Entwickler.

Comments

[Bohne47]

Ja, das mit dem faul stimmt, aber bei 50 input Elementen dachte ich es muss auch einfacher gehen.

[Zwnow]

@Bohne47

Das tut es aus jeden Fall :D In welchem Kontext benötigt man denn so viel Input wenn ich fragen darf?

[Bohne47]

@Zwnow

Wollte einen Text machen wo man halt verschiedene Sachen eingeben muss, die dann in den text eingefügt werden, aber wenn ein Feld noch nicht ausgefüllt wurde (also value="") soll eine fehlermeldung angezeigt werden.

[Zwnow]

@Bohne47

Ahh auf jeden, hört sich cool an, viel Erfolg!

[Bohne47]

@Zwnow

Danke

[BeamerBen]

@Bohne47

falls du eine form hast könntest du auch einfach required auf die items setzen und prüfen ob die form valide ist.

[Bohne47]

Es funktioniert gut, danke. Aber mein problem ist jetzt, dass es ja nur ausgelößt wird, wenn es eingegeben wurde und nicht wenn es schon voher durch z.B. das value Atribut definiert wurde. Habe jetzt bischen rumgebastelt, aber keine Ahnung woran es liegt.

Answer 3

[BeamerBen]

Ich habe mehrere Input-Elemente mit der selben id.

🤢

Aber eine einfache Verson zu testen ob alle Input Elemente mit einer bestimmten Klasse einen bestimmten Wert haben wäre z.B.

A <input class="someclass" />
B <input class="someclass" />
C <input class="someclass" />

<button onclick="test()">Test</button>

<p id="result" />

JS:

function test() {
    const inputs = document.querySelectorAll(".someclass"),
      testResult = Array.from(inputs).every(e => e.value == 1)
  document.querySelector("#result").textContent = `Result is ${testResult}`
}

In dem Fall wäre der Test ob alle Input Elemente ein value == 1 haben.

Answer 4

[LisamagPferde04]

IDs sollten auf jeden Fall eindeutig sein. Ansonsten ist der Browser auch recht unzufrieden.

Du könntest den Elementen alle die selbe Klasse geben und dann über

getElementsByClassName

ein Array bekommen wo du mit einer simplen for Schleife alle Elemente durchgehen und vergleichen kannst.