진행률 막대 값 재설정 jQuery

Question

퀴즈가 끝나면 퀴즈의 진행률 표시 줄을 재설정하려고합니다. 당신은 아래 링크를 따라 가면

는 :

PROG 줄이 추가 질문의 배열에 따라 간다 질문

퀴즈 끝을 도달

1. 대답을
2. PROG 표시 줄이 100 %로 유지

다음은 작동 코드에 대한 링크입니다. http://codepen.io/fun/pen/RRPdbb?editors=1010

01 진행 표시 줄을 증가 23,516,

섹션은

progress += questions.length * 100/questions.length/questions.length; 

    if ($('#progress').val() >= 100) { 
    $('#progress').val(0); 
    } 
    $('#progress').val(progress); 

그러나이 단지 증가하고 재설정하지 않습니다.

희망 하시겠습니까? 여기에 코드가 있습니다.

var test_status, options, pos = 0, 
    question, optA, optB, optC, option_radio, user_guess, correct = 0, 
    progress = 0; 

var questions = [ 
    ['What is 4 * 4?', '16', '34', '18', 'A'], 
    ['What is 80/20?', '49', '4', '3', 'B'], 
    ['What is 760 - 160?', '650', '500', '600', 'C'], 
    ['What is 330 + 150?', '480', '800', '400', 'A'] 
]; 
// Function to get ids 
function _(x) { 
    return document.getElementById(x); 
}; 
// Function to ask the question 
function askQuestion() { 
    // End of quiz 
    if (pos >= questions.length) { 
    test_status.innerHTML = 'Test Complete. You scored ' + correct + ' out of ' + questions.length; 
    options.innerHTML = '<br>' + 'To attempt the quiz again' + '<br><br>' + '<button onclick = "askQuestion()"> Click here</button>'; 
    pos = 0; 
    correct = 0; 
    return false; 

    } 

    // Get position of question 
    question = questions[pos][0]; 
    // Get positions of options 
    optA = questions[pos][1]; 
    optB = questions[pos][2]; 
    optC = questions[pos][3]; 
    // Get test status id 
    test_status = _('test_status'); 
    // Get options id 
    options = _('options'); 
    // Print question stage 
    test_status.innerHTML = "<h2> You are on question " + (pos + 1) + " out of " + questions.length + "</h2>"; 
    // Print current question 
    options.innerHTML = "<h3>" + question + "</h3>"; 
    // Print options for Q 
    options.innerHTML += "<input type ='radio' name ='options' value ='A'> " + optA + "<br>"; 
    options.innerHTML += "<input type ='radio' name ='options' value ='B'> " + optB + "<br>"; 
    options.innerHTML += "<input type ='radio' name ='options' value ='C'> " + optC + "<br><br>"; 
    // Add a submit button 
    options.innerHTML += "<button onclick ='checkAnswer()'>submit</buton>"; 

}; 
// Check answer 
function checkAnswer() { 

    // Get name attr from raio 
    option_radio = document.getElementsByName('options'); 
    // loop through each radio 
    for (var i = 0; i < option_radio.length; i++) { 
    // check if option_radio is check 
    if (option_radio[i].checked) { 
     user_choice = option_radio[i].value; 
    } 
    } 
    // check is correct 
    if (user_choice == questions[pos][4]) { 
    correct++; 
    // increment progress based on questions length 
    } 
    pos++; 

    progress += questions.length * 100/questions.length/questions.length; 

    if ($('#progress').val() >= 100) { 
    $('#progress').val(0); 
    } 
    $('#progress').val(progress); 

    askQuestion(); 

}; 

askQuestion(); 

Answer 1

이것은 논리적 인 버그입니다. 확인하기 전에 값을 설정하기 만하면됩니다.

$('#progress').val(progress); 
    if ($('#progress').val() >= 100) { 
    $('#progress').val(0); 
    } 

Answer 2

확인 대신 요소의 값의 변수 진보의 가치

progress += questions.length * 100/questions.length/questions.length; 

    if (progress >= 100) { 
    $('#progress').val(0); 
    } 
    $('#progress').val(progress);