2017-02-21 5 views
2

부트 스트랩 - 슬라이더 플러그인에서 값의 변경을 캡처하는 방법을 알 수 없습니다.부트 스트랩 - 슬라이더 플러그인에서 값을 캡처하는 방법

설명서를 읽으십시오. 많은 것을 시도했다.

<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> 

시도 (더 성공 없음) :

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") }); 

그냥 성공적으로 슬라이더 값의 변화를 포착했다 거기에 사람을 찾고. 플러그인이 가치 변화를 포착 할 수있는 기능을 지원하지 않으면 다시 게시하십시오.

내가 시도의 일부에서 얻을

하나의 콘솔 로그 오류는 다음과 같습니다

catch되지 않은 ReferenceError가 : $가

를 정의되지 않은
+0

@YafimSimanovsky 여기 그것을 해결 -> http://stackoverflow.com/questions/38825650/seiyria-bootstrap-slider-getvalue-not-working! 굉장해. –

답변

1

당신은 당신이 (jQuery를하지 무시할 수 Uncaught ReferenceError: $ is not defined를 들어

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

을 시도해 봤어 테스트 됨) :

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) }); 
+0

아직은 ...하지만 지금은 @ 아서 - 감사합니다 !! –

+0

싫다면 ... 'Uncaught ReferenceError : $ is not defined' 오류가 다시 발생합니다 @Arthur. –

+0

다음 제안을 시도합니다 –

0

이 솔루션에는 jquery가 필요합니다. .

슬라이더에는 입력을 포함하지 않지만 "변경"을 포함하는 자체 이벤트 핸들러가 함께 제공됩니다. https://github.com/seiyria/bootstrap-slider

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

슬라이더의 새 값을 얻으려면 다음을 수행하십시오.

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