RedlightX
Aktiver NGBler
- Registriert
- 18 Juli 2013
- Beiträge
- 1.094
Hallo,
ich versuche mich gerade an einer simplen Erweiterung für Chrome.
Manifest usw wurde natürlich schon erstellt und eingebunden ist die Extension auch schon.
Ich sitze gerade (eigtl. schon seit gestern Morgen) an der options.html (options.js existiert natürlich auch)
Was ich möchte:
Nutzer soll 2 Werte eingeben (apikey & apisecure).
Beim Speichern sollen diese Werte in dem localStorage geschrieben werden.
-> Beim erneuten Öffnen der optionen, sollen die bereits hinterlegten Daten im input-Feld angezeigt werden.
Meine options.html sieht folgendermaßen aus:
[src=html5]<html>
<head>
<title>API-Konfiguration</title>
<script type="text/javascript" src="options.js"></script>
</head>
<body>
<h3>Bitte API-Key und API-Secure hinterlegen:</h3>
<form>
API-Key:<br>
<input type="text" id="v_apikey" name="apikey">
<br>
API-Secure:<br>
<input type="text" id="v_apisecure" name="apisecure">
</form>
<br />
<button id="button1">Speichern</button>
<br />
<button id="button2">Daten loeschen</button>
</body>
</html>[/src]
Meine options.js schaut so aus:
[src=javascript]document.addEventListener("load", loadOptions, false);
document.addEventListener("DOMContentLoaded", loadOptions, false);
document.getElementById("button1").addEventListener("click", saveOptions);
function loadOptions() {
var apikey =localStorage.apikey ;
var apisecure = localStorage.apisecure;
}
function saveOptions() {
var apikey = document.getElementById("v_apikey").value;
var apisecure = document.getElementById("v_apisecure").value;
window.localStorage.setItem("v_apikey", apikey);
window.localStorage.setItem("v_apisecure", apisecure);
}
function eraseOptions() {
localStorage.removeItem("v_apikey");
localStorage.removeItem("v_apisecure");
location.reload();
}[/src]
Im localStorage zeigt er zwar die Keys an (apikey, apisecure) Allerdings als Value ein "undefined", was so natürlich nicht sein soll.
Auch die input-Felder sind leer und Firebug spuckt auch keinen Fehler aus
Hat jemand eine Idee?
Danke!
--- [2015-02-18 12:54 CET] Automatisch zusammengeführter Beitrag ---
Es funktioniert nun so weit:
[src=javascript]document.addEventListener("load", loadOptions, false);
document.addEventListener("DOMContentLoaded", loadOptions, false);
function loadOptions() {
document.getElementById('button1').addEventListener('click', saveOptions, false);
document.getElementById('button2').addEventListener('click', eraseOptions, false);
var apikey =localStorage.apikey ;
var apisecure = localStorage.apisecure;
}
window.addEventListener('load', loadOptions, false);
function saveOptions() {
var apikey = document.getElementById("v_apikey").value;
var apisecure = document.getElementById("v_apisecure").value;
window.localStorage.setItem("v_apikey", apikey);
window.localStorage.setItem("v_apisecure", apisecure);
}
function eraseOptions() {
localStorage.removeItem("v_apikey");
localStorage.removeItem("v_apisecure");
location.reload();
}[/src]
Jetzt muss ich nur noch die gespeicherten Werte, sofern vorhanden, im inputfield ausgeben
ich versuche mich gerade an einer simplen Erweiterung für Chrome.
Manifest usw wurde natürlich schon erstellt und eingebunden ist die Extension auch schon.
Ich sitze gerade (eigtl. schon seit gestern Morgen) an der options.html (options.js existiert natürlich auch)
Was ich möchte:
Nutzer soll 2 Werte eingeben (apikey & apisecure).
Beim Speichern sollen diese Werte in dem localStorage geschrieben werden.
-> Beim erneuten Öffnen der optionen, sollen die bereits hinterlegten Daten im input-Feld angezeigt werden.
Meine options.html sieht folgendermaßen aus:
[src=html5]<html>
<head>
<title>API-Konfiguration</title>
<script type="text/javascript" src="options.js"></script>
</head>
<body>
<h3>Bitte API-Key und API-Secure hinterlegen:</h3>
<form>
API-Key:<br>
<input type="text" id="v_apikey" name="apikey">
<br>
API-Secure:<br>
<input type="text" id="v_apisecure" name="apisecure">
</form>
<br />
<button id="button1">Speichern</button>
<br />
<button id="button2">Daten loeschen</button>
</body>
</html>[/src]
Meine options.js schaut so aus:
[src=javascript]document.addEventListener("load", loadOptions, false);
document.addEventListener("DOMContentLoaded", loadOptions, false);
document.getElementById("button1").addEventListener("click", saveOptions);
function loadOptions() {
var apikey =localStorage.apikey ;
var apisecure = localStorage.apisecure;
}
function saveOptions() {
var apikey = document.getElementById("v_apikey").value;
var apisecure = document.getElementById("v_apisecure").value;
window.localStorage.setItem("v_apikey", apikey);
window.localStorage.setItem("v_apisecure", apisecure);
}
function eraseOptions() {
localStorage.removeItem("v_apikey");
localStorage.removeItem("v_apisecure");
location.reload();
}[/src]
Im localStorage zeigt er zwar die Keys an (apikey, apisecure) Allerdings als Value ein "undefined", was so natürlich nicht sein soll.
Auch die input-Felder sind leer und Firebug spuckt auch keinen Fehler aus
Hat jemand eine Idee?
Danke!
--- [2015-02-18 12:54 CET] Automatisch zusammengeführter Beitrag ---
Es funktioniert nun so weit:
[src=javascript]document.addEventListener("load", loadOptions, false);
document.addEventListener("DOMContentLoaded", loadOptions, false);
function loadOptions() {
document.getElementById('button1').addEventListener('click', saveOptions, false);
document.getElementById('button2').addEventListener('click', eraseOptions, false);
var apikey =localStorage.apikey ;
var apisecure = localStorage.apisecure;
}
window.addEventListener('load', loadOptions, false);
function saveOptions() {
var apikey = document.getElementById("v_apikey").value;
var apisecure = document.getElementById("v_apisecure").value;
window.localStorage.setItem("v_apikey", apikey);
window.localStorage.setItem("v_apisecure", apisecure);
}
function eraseOptions() {
localStorage.removeItem("v_apikey");
localStorage.removeItem("v_apisecure");
location.reload();
}[/src]
Jetzt muss ich nur noch die gespeicherten Werte, sofern vorhanden, im inputfield ausgeben
Zuletzt bearbeitet: