Übergeben Sie Variablen zwischen HTML-Seiten mithilfe von JavaScript
P粉757432491
P粉757432491 2023-08-21 22:08:28
0
2
463
<p>Ich habe zwei Seiten – „Seite 1“ und „Seite 2“. Auf Seite 1 gibt es ein Textfeld mit einem Wert von beispielsweise 100 und eine Schaltfläche. </p> <p>Nachdem ich auf die Schaltfläche geklickt habe, möchte ich, dass JavaScript den Wert des Textfelds in einer globalen Variablen speichert und zu Seite 2 springt. Mit „window.onload“ möchte ich, dass die zweite JavaScript-Funktion den gespeicherten Wert auf Seite 1 einfügt. </p> <p>Das ist mein JavaScript-Code: </p> <pre class="brush:php;toolbar:false;"><script type="text/javascript"> var price; //Außerhalb der Funktion deklariert = globale Variable? Funktion save_price(){ Alert("started_1"); //Nur als Referenz preis = document.getElementById('the_id_of_the_textbox').value; Alert(Preis); //nur als Referenz }</pre> <pre class="brush:php;toolbar:false;"><script type="text/javascript"> Funktion read_price(){ alarm("started_2"); Alert(Preis); }</pre> <p>Auf „Seite 1“ habe ich einen Senden-Button: </p> <pre class="brush:php;toolbar:false;"><input class="button_send" id="button_send" type="submit" value="Submit_price" onclick="save_price();"/> ;</pre> <p>Es startet die JavaScript-Funktion und leitet mich korrekt zu meiner Seite 2 weiter. </p> <p>Aber auf der zweiten Seite: </p> <pre class="brush:php;toolbar:false;">window.onload=read_price();</pre> <p>Ich erhalte immer den „undefinierten“ Wert für den globalen variablen Preis. </p> <p>Ich habe viel über diese globalen Variablen gelesen. Zum Beispiel auf dieser Seite: Problem mit globaler Variable. Aber ich bekomme es nicht zum Laufen...</p> <p>Warum funktioniert das nicht? </p>
P粉757432491
P粉757432491

Antworte allen(2)
P粉998920744

您在这里的最佳选择是使用查询字符串来“发送”值。

如何使用JavaScript获取查询字符串值

  • 所以页面1重定向到page2.html?someValue=ABC
  • 页面2可以读取查询字符串,特别是键“someValue”

如果这不仅仅是一个学习练习,您可能需要考虑这样做的安全性问题。

全局变量在这里对您没有帮助,因为一旦页面重新加载,它们就会被销毁。

P粉445750942

在没有阅读您的代码,只有您的场景的情况下,我会使用 localStorage 来解决。 以下是一个示例,我将使用 prompt() 来简化。

在页面1上:

window.onload = function() {
   var getInput = prompt("嘿,在这里输入一些内容:");
   localStorage.setItem("storageName",getInput);
}

在页面2上:

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

您也可以使用 cookies,但是 localStorage 允许更多的空间,并且在请求页面时不会将它们发送回服务器。

Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage