Foundation 6.2 Schieberegler Wert mit js

Question

Ich möchte einen Wert von Slider mit Javascript setzen, aber ich weiß nicht, wie es geht. Ich habe versucht, einen Wert der versteckten Eingabe zu ändern, aber der Schieberegler bewegt sich nicht.

mein HTML:

<div class="slider" data-slider data-initial-start="50" data-step="5"> 
    <span class="slider-handle" data-slider-handle role="slider" tabindex="1" ></span> 
    <span class="slider-fill" data-slider-fill></span> 
    <input type="hidden"> 
    </div> 

Bitte Hilfe. Vielen Dank.

Answer 1

Hi, wenn Sie den Schieberegler bewegen, wird der neue Wert in den versteckten Eingang gesetzt. Wenn Sie jedoch den Wert des verborgenen Eingangs ändern, wird der Schieberegler nicht verschoben.

So können Sie dies tun:

var pos = 5; mySlider = new Foundation.Slider($("#my_slider"), {initialStart: pos});

Answer 2

Sie haben die Art der Eingabe von versteckt sich ändern und aria-Kontrollen = „id“ an dem Schiebergriff und „id“ hinzuzufügen, ist die ID der Eingang - der Eingang auf der Seite überall sein, dann jetzt müssen Sie nur mit Javascript um den Wert des Eingangs ändern

<div class="slider" data-slider data-initial-start="50" data-step="5"> 
    <span class="slider-handle" data-slider-handle role="slider" tabindex="1" aria-controls="myInputId" ></span> 
    <span class="slider-fill" data-slider-fill></span> 
    <input type="number" id="myInputId"> 
</div> 


document.getElementById("myInputId").value = "99";