Jquery UI에 따라 변경되는 추가 텍스트 슬라이더

Question

jquery UI Slider는 0에서 100까지, 기본 시작은 50입니다. 3 가지 옵션 중 하나를 인쇄하는 추가 간단한 텍스트 상자를 만드는 방법이 궁금합니다. 슬라이더의 사용자 값에 따라 다릅니다. 기본적으로 범위가 0-33이면 텍스트 상자에 (Easy), 34-66의 범위에서는 평균 (average), 67-100은 읽기 (Hard)로 표시됩니다.

이 현재 내 코드입니다 :

<script> 
$(".slider3").slider({ 
animate: true, 
range: "min", 
value: 50, 
min: 0, 
max: 100, 
step: 1, 

//this gets a live reading of the value and prints it on the page 
slide: function(event, ui) { 
$("#slider-result3").html(ui.value); 
}, 

}); 
</script> 

나는 시간이를 알아 내기 위해 노력했습니다으로 도와주세요.

Answer 1

당신은 슬라이드 방식의 ui.value에 경우 작업을 수행해야합니다

if (ui.value <= 33) 
    $("#slider-input3").val("easy"); 
else if (ui.value <= 66) 
    $("#slider-input3").val("average"); 
else 
    $("#slider-input3").val("hard"); 

는 예를 들어이 jsfiddle를 참조하십시오.