Wie man den Wert onChange im Bootstrap-Slider-Plugin feststellt

Question

Ich kann nicht herausfinden, wie man die Änderung im Wert auf dem Bootstrap-Slider-Plugin festhält.

Lesen Sie die Dokumentation. Versuchte viele, viele Dinge.

<div class="form-group"> 
    <label class="col-md-4 control-label" for="language_spanhish">Spanish</label> 
    <div class="col-md-6"> 
    <input id="language_spanish" type="text" data-provide="slider" 
     data-slider-ticks="[0, 1, 2]" 
     data-slider-min="0" 
     data-slider-max="2" 
     data-slider-step="1" 
     data-slider-value="0" 
     data-slider-tooltip="show" 
     onchange="alert('you changed it')" 
    /> 
    </div> 
</div> 

Versuchte (kein Erfolg):

document.getElementById("#language_spanish").getAttribute("data-slider-value"); 
     var getIt = $('#language_spanish').data('slider').getValue(); 
     alert(getIt); 
spanish.on("slide", function(slideEvt) { console.log(slider.getValue()); alert(slideEvt.value); }); 
     $('#language_spanish').slider().on('slide', function(ev){ alert("I changed it") }); 

Einfach mal für jemanden da draußen, der die Wertänderung auf dem Schieber erfolgreich eingefangen hat. Bitte poste zurück, wenn das Plugin die Möglichkeit zur Erfassung der Wertänderung nicht unterstützt.

Ein Konsolenprotokoll Fehler ich von einigen der Versuche erhalten ist:

Uncaught Reference: $ nicht

definiert ist

Answer 1

Sie

versuchen Haben

$('#language_spanish').on('input', function(ev){ alert("I changed it") }); 

Für Uncaught ReferenceError: $ is not defined können Sie jQuery umgehen (nicht getestet):

var slider = document.getElementById("language_spanish") 
console.log("init : " + slider.value) 
slider.addEventListener('input', function(e){ alert("I changed it " + e.currentTarget.value + " === " + input.value) }); 

Answer 2

Diese Lösung erfordert jquery .

Der Schieberegler verfügt über eigene Event-Handler, die keine Eingabe enthalten, aber "Änderung" enthalten. https://github.com/seiyria/bootstrap-slider

$("#language_spanish").on("change", function(){ 
console.log("Changed"); 
}); 

Wenn Sie den neuen Wert des Schiebers erhalten möchten, dann.

$("#language_spanish").on("change", function(event){ 
console.log("Changed to ", event.value.newValue); 
});