jQuery-UI ProgressBar

Question

암호 강도를위한 ProgressBar가 필요합니다. 그래서 진행률 막대 안에 텍스트를 쓰는 방법이 있습니까? 여러 가지 방법을 시도해 봤지만 아무 것도 찾을 수 없습니다. 어느 한 사람이 제어 할 이벤트 처리기로이 작업을 수행 할 수 있습니까? 내 코드는 ....입니다

$("#progressbar").progressbar({ 
     value: score 
    }); 

outputResult($("#progressbar"), score); 

$("#inputPassword").bind("keyup", checkVal); 

function outputResult(selecter, value) 
{ 

    selecter.progressbar("option", "value", value); 
     var selector = "#progressbar > div"; 
     $(selector).css({ 'background': 'Red' }); 
     $(selecter).text(value + ' %'); 

} 

Answer 1

당신은 텍스트를 포함하는 내부 span 요소를 만들 수 있습니다

<div id="progressbar"> 
    <span class="text"> 
    </span> 
</div> 

을 그리고 그 요소에 대한 적절한 스타일을 정의 :

.text { 
    color: white; 
    position: absolute; 
} 

그런 다음 outputResult 함수에서 :

$("#progressbar").progressbar("option", "value", value); 
$("#progressbar span.text").text(value + "%"); 

다음은 작동 예제입니다. http://jsfiddle.net/v48eP/