Übergeben von Variablen über JavaScript aus einer html-Seite zu einer anderen Seite

Ich habe zwei Seiten "Seite 1" und "Seite 2". Auf Seite 1 gibt es ein text-Feld mit einem Wert von z.B. 100 und einem Knopf am Ende.

Durch drücken der Taste möchte ich javascript zum speichern der Wert der textbox in eine Globale (?) variable und springen Sie auf Seite 2. Mit " - Fenster.onload" ich will eine zweite Javascript-Funktion alert wird der Wert gespeichert page1.

Hier ist mein Javascript code:

<script type="text/javascript">

var price; //declare outside the function = global variable ?

function save_price(){

    alert("started_1"); //just for information

    price = document.getElementById('the_id_of_the_textbox').value; 

    alert(price); //just for information         
}

<script type="text/javascript">

function read_price(){

    alert("started_2");

    alert(price);

}

Auf "Seite 1" ich habe diese senden-Button mit:

<input class="button_send" id="button_send" type="submit" value="Submit_price" onclick="save_price();"/>

Es startet die Javascript-Funktion und leitet mich korrekt an meine page2.

Aber mit diesem ont der zweiten Seite:

window.onload=read_price();

Bekomme ich immer ein "undefined" Wert der globalen Variablen Preis.

Ich habe viel gelesen über diese globalen Variablen. E. g. auf dieser Seite: Problem mit globalen Variablen.. Aber ich kann Sie nicht arbeiten...

Warum dies nicht funktioniert?

  • Sie missverstanden, was "Globale Variablen" in JavaScript im browser. Sie sind immer noch an der Seite, auf die Sie setzen in, es gibt Sie nicht in anderen Seiten.
  • Globale Variablen sind nur global für die Seite. Vielleicht haben Sie einen Blick auf die url-Parameter, stackoverflow.com/questions/979975/... ?
  • nha) Danke! Nicht wusste, dass Sie noch an der Seite. Ich natürlich, Sie sind "wirklich" global (gilt für alle Seiten)
  • Mögliche Duplikate von Persistent-Variablen zwischen page-loads
InformationsquelleAutor Kronwied | 2015-01-04
  1. 40

    Lesen, ohne Ihren code, sondern nur dein Szenario würde ich lösen, indem Sie mit localStorage.
    Hier ist ein Beispiel, ich verwende prompt() kurz.

    Auf Seite1: 

    window.onload = function() {
   var getInput = prompt("Hey type something here: ");
   localStorage.setItem("storageName",getInput);
}

    Auf page2: 

    window.onload = alert(localStorage.getItem("storageName"));

    Sie können cookies auch verwenden, aber localStorage ermöglicht viel mehr Räume, und Sie werden nicht zurück gesendet-Server beim anfordern von Seiten.

    • Dies ist eine gute Lösung, aber Sie haben nicht erklärt, warum Sie sollten nutzen diese. Der OP hat nicht verstanden Globale Variablen in JS.
    • Danke. Eine wirklich tolle und einfache Lösung. 🙂 Muss ich beachten (als LiamB sagte) einige grundlegende Sicherheit mit dieser Lösung?
    • Krownied: "localStorage" ist pro-Domäne. Andere Websites können nicht auf Ihre localStorage-es sei denn, Sie haben andere Skripte aus anderen Quellen (z.B. Google Analytics). sessionStorage verfällt, wenn Sie schließen Sie die Registerkarte. Cookies haben ein kürzeres Ablaufdatum als "localStorage". Jedoch, wenn Daten enthält sensible Informationen, sollten Sie investieren in ein back-end-Austausch-Schema anstatt zu speichern direkt in die browser, die Benutzer anzeigen, Bearbeiten, etc. (wie cookies)
    • in meinem page2 es sagt, dass "localstorage" ist nicht definiert
    • Und mir ist es einfach nicht speichern ... auf Seite 2 das Ergebnis der localStorage.getItem("key") ist null
    • Gibt es eine Lösung für die übergabe der Daten im Speicher aus localhost/a.html zu myhost/b.html?
    • Dies ist eine gute Lösung +1, aber ich nehme an, Benutzer können Lesezeichen für diese Seite (wie immer leitet mich zu id = 5), wenn Sie lokalen Speicher verwenden, anstelle von query-string.

    InformationsquelleAutor potasmic
  2. 6

    Ihre beste option ist hier die Verwendung der Query-String auf 'senden' das Wert.

    how to get-query-string-Wert mit javascript

    • Also Seite 1 leitet auf page2.html?Wert=ABC
    • Seite 2 können Sie dann
      Lesen Sie die query-string und speziell die key 'someValue'

    Ist dies nichts mehr als eine Lern-übung Sie können prüfen die Auswirkungen auf die Sicherheit dieser obwohl.

    Globale Variablen pflegen Sie hier, sobald die Seite neu geladen werden Sie zerstört.

    InformationsquelleAutor LiamB
  3. 2

    Haben Sie ein paar verschiedene Optionen:

    • können Sie eine SPA-router wie SammyJS, oder Angularjs und ui-router, so dass Ihre Seiten sind zustandsorientiert.
    • verwenden sessionStorage speichern Ihren Zustand.
    • speichern der Werte in der hash-URL.
    • macht einen sehr guten Punkt. Meine Vorschläge, wie auch seine, ein Sicherheits-Implikation, in denen Werte geändert werden können, indem der Benutzer außerhalb der Anwendung: entweder, indem Sie die querystring-Parameter, hash-Parameter localStorage-Daten oder durch andere Mittel. Sollte man immer tun, eine Validierung auf Ihre back-End-Dienst von den Daten.
    • Wie zu verwenden session-html?
    • die akzeptierte Antwort behebt diese.
    InformationsquelleAutor Martin
Schreibe einen Kommentar