• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Frage JavaScript-Ergebnisse in HTML weiterverwenden

MacInternet

Neues Mitglied
Hilfe! Ich fummel da schon über 2 Wochen rum und komme einfach nicht weiter!

Der Anwender soll auf der Seite einen Song und eine Nummer per Dropdown-Liste auswählen - das klappt jetzt schon, aber ich will die beiden Auswahlen anschließend mehrmals noch in HTML verwenden - und bekomme das einfach nicht hin!

Wer kann mir denn mal weiter helfen bitte? Also ich möchte anschließend sowohl die Nummer der Auswahl als auch den Titel noch verwenden und das mehrmals - nur wie??
Die Auswahl ist in JavaScript, das Formular aber in HTML.

Ich hoffe mal, es ist korrekt, wenn ich die nötigen Zeilen hier jetzt einfüge, ich habe nichts gefunden, wo man Quelltext eingeben könnte. Und ich wäre für jeden Tipp, der mich endlich weiter bringt, nun dankbar!

Quellcode:

<!DOCTYPE HTML>
<html>
<head>

<script>

document.addEventListener('DOMContentLoaded', function () {

document.Testform.Song.addEventListener('change', CheckAuswahl);

function CheckAuswahl () {
var menu = document.Testform.Song;
document.querySelector('output').innerHTML = menu.options[menu.selectedIndex].value;
}

});


</script>

</head>
<body>

<font face="VERDANA,ARIAL,HELVETICA">
<br> <br> <h4>Bitte zuerst den gew&uuml;nschten Song ausw&auml;hlen: </h4> <br><br>

<font size="+1"><form name="Testform">
<form action="#">
<label>Titel (bitte ausw&auml;hlen):
<select name="Song">
<option value="">Bitte w&aumlhlen</option>
<option value="126">Song-Titel No. 1</option>
<option value="127">Song-Titel No. 2</option>
<option value="128">Song-Titel No. 3</option>
<option value="129">Song-Titel No. 4</option>
<option value="130">Song-Titel No. 5</option>

</select>

</label>
</form>
</p>
<p>
<br> <br>
<b> Ausgew&aumlhlt: Song Nr: <font size="+2"> <font color="#800000"> <output> </output> </b></font> </font>
</p></font>
Ich m&ouml;chte das Passwort f&uuml;r diesen Song anfordern: Ab hier soll es dann eingefügt werden!
</font>

<body>

 
Werbung:
Mmh leider ist die Frage etwas unverständlich formuliert. "In HTML weiter verwenden" musst du genauer ausführen.

Tipp: Das HTML ist etwas altbacken (<font>) und es fehlt ein </html> am Schluss
 
Also dass da mal ein End-Code fehlt, ist leider fast immer so, wenn man aus einem 4-Seiten Quellcode alles raus löscht, was hier jetzt zur Frage nicht hin gehört...

Und mein HTML ist Dir also "veraltet"? Sorry, aber ich habe es vor 42 Jahren gelernt und weiß jetzt nicht, wo denn steht, dass ich, was jahrzehntelang bis heute problemlos funktioniert hat, nun nicht mehr verwenden dürfte...

Auch die Problem-Beschreibung steht sowohl in der Überschrift als auch im Quelltext selber: Wie kann ich in Javascript ausgelesene Werte (durch Dropdown-Auswahl) in HTML (am Ende des Codes!) weiter verwenden? Sämtliche bislang probierte Möglichkeiten funzten nämlich nicht - und vor über 40 Jahren gab es nun mal weder HTML5 noch sonst was, auch kein DOM oder Javascript... :-(
Ich will die Auswahl, die der User getroffen hat, weiter verwenden - aber nicht in Javascript!

Gruss Mac
 
Werbung:
Danke, Sempervivum, genau so etwas meinte ich, jedoch waren meine beiden grössten Probleme, dass 1. eben nur immer die Song-Nr, aber nie der Titel ausgegeben wurde und 2. dass auch immer nur EINMAL eine Ausgabe dann möglich war - aber ich werde das hier gleich mal bei mir einbauen und testen! Vielen Dank für den Hinweis! Wenn das jetzt mit dem Titel auch noch mal gehen würde...

PS: Bei mir verschwindet bei den 3 Punkten leider nur die Sidebar oder blendet sich wieder ein... Da kann leider nirgendwo Code eingegeben werden.
 
Hallo Sempervivum,
hab alles eingebaut - aber leider wird auch bei Deinem Beispiel weder die Song-Nr noch der Titel auch nur einmal ausgegeben! Immerhin hatte ich schon mal die Nr, wenn auch den Titel nicht... Aber es muss doch möglich sein, so was nur einfach mal in HTML auszugeben! Verdammt...

Ach ja, das mit den 3 Punkten hatte ich wohl falsch verstanden - sorry, war das erste Mal in so einem Forum...
Gruß Mac
 
Werbung:
Das sieht schon mal super aus! Zumindest die Song-Nummer kann jetzt tatsächlich mehr als nur einmal ausgegeben und dann weiter verwendet werden! Danke - aber wie gesagt: mit dem Titel habe ich es bereits versucht, aber da schweigt sich der Editor leider weiterhin aus. :-(
Ich hoffe, es klingt jetzt nicht unverschämt, aber weil ich genau da dran schon 2 Wochen ohne Ergebnis fummel: es ist m.E. nur noch eine Zeile - könntest Du mir das für den "Titel" nicht auch noch sagen? Danke Dir schon mal im Voraus!

Bei der Gelegenheit:. vor ein paar Jahren hatte ich einen Rechner-Wechsel und musste daher auch den Editor wechseln: seither benutze ich "Phase 5", immerhin kann der auch Javascript verarbeiten, aber was fehlt, ist die Möglichkeit, nur mal den Inhalt von Variablen an bestimmten Stellen zu überprüfen - kennst Du da vielleicht einen besseren Editor?

Gruß Mac
 
BINGO! Jetzt klappt es auch mit dem Titel - 1000 Dank, bist ein Engel! Ich wusste doch, dass ich immer irgendwo irgendwas vergesse, wenn ich in JS rum fummel... ;-)

Super, hast mit wirklich geholfen und nun sehe ich auch, was ich dauernd falsch gemacht habe! Gleich mal alles nehmen und wieder in meinen Code dann rein packen...

Viele Grüsse und einen schöne Woche noch,
wünscht Mac

PS: Hatte mal gehört, Visual Studio Code kann nur VBA? Ist aber auch schon Jahre her. Ich schau gleich mal, danke für den Tipp! Und ja, so richtig Up to Date scheint auch Phase 5 heute nicht mehr zu sein- der interne Browser dort kann fast gar nichts, aber ich habe dort mehrere Standard-Browser eingebunden, aber auch das half nicht weiter, weil man das Programm auch nicht unterwegs anhalten kann leider.
 
Hallo Sempervivum, ich wage es noch mal, Dich anzusprechen, habe aber nirgendwo hier eine Funktion wie "Privatnachricht" oder so etwas gefunden.

Inzwischen habe ich nicht nur den Code eingebaut überall und im Prinzip funktioniert jetzt fast alles - bis auf eine Sache: Da gibt es (z.B. auf der gleichen Seite) weitere Forms (z.b. mit method 'post' etc.) und obwohl es möglich ist, die "SongNr" z.b. in eine Mail eintragen zu lassen, gelingt es mir dennoch nicht, die bereits ja deklarierte Variable in ein Input-Feld des anderen Formulars eintragen zu lassen... Schlimmer noch: sowie ich deshalb eine andere Variable (z.B. "ausgabe") im Script über let oder var definiere, sind sofort alle Inhalte wieder weg. :-(

Gibt es da irgendeinen "Trick" oder so was dafür, dennoch den Wert in ein "Value" des Input-Feldes eintragen zu lassen, der mir irgendwie jetzt nicht bekannt nicht...? Jedenfalls wäre ich schon für einen letzten Hinweis diesbezüglich sehr dankbar, denn alles scheitert nun daran, dass das Input-Feld leider leer bleibt...

Viele Grüsse und endlich ist es mal ein wenig wärmer jetzt geworden,
Mac
 
Werbung:
Whow - Du bist nicht nur super, sondern auch extrem fix! :-)
Erst noch einmal meinen herzlichsten Dank und dass es genau da ein Problem gab, habe ich ja bemerkt, auch wenn ich nicht ganz kapiert habe, warum nur bei der Eingabe eines einzigen "let" oder so gleich sämtliche Werte überall immer gelöscht werden...
Aber egal, Hauptsache, es geht jetzt endlich weiter! Das Hauptproblem bei der ganzen Sache hier ist, dass es von vielen Leuten mal erstellt wurde und mehrere Programmiersprachen sich auch noch ständig jetzt in die Quere kommen, aber ich versuche es dennoch, irgendwie alles auseinander zu klauben jetzt und bis auf das Input-Feld ging es ja auch (fast) alles schon. Nur war Javascript halt nie meine Lieblingssprache... ;-)

Vielen Dank und einen angenehmen Tag dann noch
wünscht Mac

PS: Um um einen besseren Editor wie Visual Studio z.B. werde ich mich nun auch mal bemühen!
 
Oh, ein "Leidensgefährte"! Und ich dachte immer, sowas passiert(e) nur mir immer... ;-)

Habe die neue Klasse an mehreren Formularen getestet, aber leider überall dasselbe Ergebnis: in "number"-Feldern bleibt alles leer, in "text"-Feldern, die ich nur zur Kontrolle anlegte, wird dann der Name der Variablen eingetragen, aber diese hat dann keinen Wert. Irgendwie ist da der Wurm wirklich drin... Dabei sollte es doch gerade in Nummer-Feldern jetzt klappen - tut es nur nicht.

Ich glaube, ich mache die Kiste für heute jetzt aus, hier geht es erst morgen dann weiter.
Schönen, sonnigen Abend noch,
Gruß Mac
 
Klaro, kein Problem - wenn es ok ist, nehme ich wieder einen Teil eines Test, das ist kürzer...
In der Hoffnung, dass ich jetzt nicht was Wichtiges gelöscht habe ;-)

Lass Dir Zeit, ich habe erst mal einen Arzt-Termin jetzt, komme erst in 2 Std. wieder. Und wie immer:

for i=1 to 1000; writeln('Danke!!'); next i ;)

Mac

PS: Diesmal habe ich sogar gefunden, wo der Code hin kann!


Code:
<head>
    <title>Test Select</title>
    <script>

        document.addEventListener('DOMContentLoaded', function () {

            document.Testform.Song.addEventListener('change', CheckAuswahl);

            function CheckAuswahl() {
                const menu = document.Testform.Song,
                    songNr = menu.value,
                    songTitle = menu.options[menu.selectedIndex].innerHTML;
                document.querySelectorAll('.song-nr').forEach((item, idx) => {
                    item.textContent = songNr;
                });
                document.querySelectorAll('.song-nr-input').forEach((item, idx) => {
                    item.value = songNr;
                });
                document.querySelectorAll('.song-title').forEach((item, idx) => {
                    item.innerHTML = songTitle;
                });
            }
        });


    </script>

</head>

<body>
 <br>
  <font face="VERDANA,ARIAL,HELVETICA">
    <h4>Bitte zuerst den gewünschten Song auswählen: </h4>
    <form name="Testform">
        <label>Titel (bitte auswählen):
            <select name="Song">
                <option value="">Bitte w&aumlhlen</option>
                <option value="126">Titel 1</option>
                <option value="127">Titel 2</option>
                <option value="128">Titel 3</option>
                <option value="129">Titel 4</option>
                <option value="130">Titel 5</option>
            </select>
        </label>
    </form>

    <p>  <font face="VERDANA,ARIAL,HELVETICA">
     <br>   <br>  <font size="+1">
        Ausgew&aumlhlt: Song Nr: <font size="+2">  <font color="#800000"><span class="song-nr"></span> </font> </font>   <br>
       <font size="+1"> für den  Titel: <i>"<span class="song-title"></span>"</i></font>
    </p>


    <br>
    Trage bitte hier die Nummer des Songs ein und ... blablahblah <br>  <br>
  
  <form method="post" action="mailto:[email protected]?subject=Ich%20moechte%20bitte%20... Song:" >

       Song-Nummer:<input type="number" name="Song-Nummer" size="5" maxlength="5" min="126" max="320" step="1" value="song-nr-input" /><br />
          <br>
      <input type="submit" style="BACKGROUND-COLOR:#FFC125;font-size:16px" value="Passwort per E-Mail anfordern" />

</form>
      <br>

     
</body>

</html>
 
Werbung:
*schnapp* gleich mal testen - offenbar ein mächtiges Missverständnis, sorry! Ich dachte, das wäre so machbar!

Vielen Dank erst mal, baue es gleich in den richtigen Code dann ein und sage dann Bescheid, ob das Input-Feld bzw. dort alle Felden nun gefüllt werden. ;-)

Gruß Mac
 
Jo, funzt nun alles super - ich weiß gar nicht, wie ich Deine tolle Unterstützung wieder gut machen kann...
Nun geht es hier endlich weiter mit allem :-)

Wünsche Dir alles Gute,
viele Grüsse,
Mac
 
Zurück
Oben