Flexbox-Element ausblenden, basierend auf Nachbarelementgröße oder -wert

Question

Ich verwende eine Flexbox, um zwei benachbarte Elemente auf derselben Linie zu haben. Das linke Element hat etwas Text und das rechte Element hat eine Nummer.

Wenn das rechte Element einen Wert mit mindestens 7 Ziffern enthält (> 999.999 oder < -999.999), sollte das linke Element mit dem Text ausgeblendet werden, um Platz für den größeren Wert zu schaffen.

Irgendwelche Ideen, wie Sie mit diesem Problem umgehen? Soll ich die Logik basierend auf der Größe des richtigen Elements oder des Wertes erstellen? Ich hoffe, dass ich nicht so etwas wie einen Beobachter brauche.

Answer 1

können Sie den Hörer "onchange""keyup" verwenden:

document.getElementById("right").addEventListener("keyup", myCheck); 

Arbeiten groß:

jsFiddle here

Es hängt wirklich davon, ob das richtige Element ein Textfeld ist oder nicht, wenn es sich um eine Textbox ist , keyup listener ist der beste, aber wenn es nur ein div ist, funktioniert der onchange-listener.