Hallo,
ich nutze in einem Formular einen Slider. Meine Fragen dazu sind:
1) Wie kann ich den Slider beim Laden auf den im localstorage gespeicherten Wert setzen?
2) Wie kann ich beim Schieben den aktuellen Wert neben dem Slider anzeigen? Dachte es würde über das <output>-Tag funktionieren?!
Ich habe jetzt einmal alles 'klickbar' in folgenden Code ausgelagert:
Vielen Dank im Voraus für Eure Hilfe.
ich nutze in einem Formular einen Slider. Meine Fragen dazu sind:
1) Wie kann ich den Slider beim Laden auf den im localstorage gespeicherten Wert setzen?
2) Wie kann ich beim Schieben den aktuellen Wert neben dem Slider anzeigen? Dachte es würde über das <output>-Tag funktionieren?!
Ich habe jetzt einmal alles 'klickbar' in folgenden Code ausgelagert:
Code:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input type="range" id="slider" min="0" max="180" step="1">
<output for="slider" id="degree">90</output>
<p>
<button id="save">Save</button>
<button id="show">Show</button>
<button id="set">Set</button>
</p>
<script>
function saveValue() {
var cAngle = document.getElementById('slider').value;
localStorage.setItem('degree', cAngle);
document.getElementById('degree').innerHTML = cAngle;
return cAngle;
}
function getValue() {
alert(localStorage.getItem('degree'));
}
function setValue() {
// - gespeicherten Wert auf Range setzen
// - gespeicherten Wert in document.getElementById('slider').innerHTML setzen
}
document.getElementById('save').addEventListener('click', saveValue);
document.getElementById('show').addEventListener('click', getValue);
document.getElementById('set').addEventListener('click', setValue);
</script>
</body>
</html>Vielen Dank im Voraus für Eure Hilfe.
Zuletzt bearbeitet von einem Moderator:
