2016-05-24 2 views
0

Я пытаюсь добавить все значения класса tmpcpa и разместить результат в final_cpa, но final_cpa всегда возвращает 0.Сумма значения в метке с таким же классом

document.getElementById('cpa' + arr[0]).innerHTML = cpa + '(' + '<label id="tmpcpa">' + tmp_cpa + "</label>" +' For Final' + ')'; 
     var final_cpa = calculate_final_cpa(); 
     console.log(final_cpa); 


function calculate_final_cpa() { 
    var final_cpa = 0; 
    $('.tmpcpa').each(function() { 
     if ($(this).val() != 0) 
     final_cpa += parseInt($(this).text()) || 0; 
    }); 
    return final_cpa; 
} 

Удивительно, когда я просмотреть исходный код в браузере HTML выглядит как

<label class="tmpcpa">0</label> но когда я действительно инспектировать элемент он показывает, как

<label class="tmpcpa">30.0</label>

Update здесь весь JS. HTML вызывает process функцию, которая в конечном счете вызывает calculate_final_cpa()

//"use strict"; 


function process(arr) { 
    document.getElementById('txtgrade' + arr[0] + arr[1] + arr[2]).innerHTML = show_grade(document.getElementById('txtpercentage' + arr[0] + arr[1] + arr[2]).value); 
    if (validateForm(arr)) { 
     var module_percentage = +document.getElementById('txtpercentage' + arr[0] + arr[1] + arr[2]).value; 
     var module_credit = +document.getElementById('txtcredit' + arr[0] + arr[1] + arr[2]).innerHTML; 
     if (!isNaN(module_percentage) || !isNaN(module_credit)) { 
      module_percentage = 0; 
      module_credit = 0; 
      var total_credit_semester = 0; 
      var sum_module_percentage_x_credit = 0; 
      for (i= 2 ; i <= arr[3] + 1 ; i++) { 
      module_percentage = +document.getElementById('txtpercentage' + arr[0] + arr[1] + i).value; 
      module_credit = +document.getElementById('txtcredit' + arr[0] + arr[1] + i).innerHTML; 
      sum_module_percentage_x_credit += module_percentage * module_credit; 
       total_credit_semester += module_credit; 
      } 
      //console.log(module_percentage); 
      var spa = sum_module_percentage_x_credit/total_credit_semester; 
      spa = spa.toFixed(1); 
      document.getElementById('spa' + arr[0] + arr[1]).innerHTML = spa; 
      calculate_cpa(arr); 
     } 
    } 
} 


function validateForm(arr) { 
    var isValid = true; 
    var tbl_id = 'tbl_semester' + arr[0] + arr[1]; 
    $('#' + tbl_id + ' :input').each(function() { 
     if ($(this).val() === '') 
      isValid = false; 
    }); 
    return isValid; 
} 

function calculate_final_cpa() { 
    var final_cpa = 0; 
    $('.tmpcpa').each(function() { 
     if ($(this).val() != 0) 
     final_cpa += parseInt($(this).text()) || 0; 
    }); 
    return final_cpa; 
} 

/* 
* Works for 2 semester per level and 3 year course (optimize later) 
*/ 

function calculate_cpa(arr) { 
    var isValid = true; 
    for (i= 1 ; i <= 2 ; i++) { 
     var spa = document.getElementById('spa' + arr[0] + i).innerHTML; 
     if (spa == "N/A") { 
      isValid = false; 
     } 
    } 
    if (isValid) { 
     var total_credit_level = 0; 
     var total_spa_x_credit = 0; 
     for (i= 1 ; i <= 2 ; i++) { 
      var arr2= [arr[0], i]; 
      var spa = +document.getElementById('spa' + arr[0] + i).innerHTML; 
      total_spa_x_credit += spa * getcredits(arr2); 
      total_credit_level += getcredits(arr2); 
     } 
     var cpa = total_spa_x_credit/total_credit_level; 
     cpa = cpa.toFixed(1); 
     document.getElementById('cpa' + arr[0]).innerHTML = cpa; 
     var level = +document.getElementById('level' + arr[0]).innerHTML 
     var tmp_cpa = ((level/100) * cpa).toFixed(1); 
     document.getElementById('cpa' + arr[0]).innerHTML = cpa + '(' + '<label class="tmpcpa">' + tmp_cpa + "</label>" +' For Final' + ')'; 
     var final_cpa = calculate_final_cpa(); 
     console.log(final_cpa); 
     if (final_cpa != 0) { 
      var award = show_award(final_cpa); 
      document.getElementById('award').innerHTML = award; 
      document.getElementById('finalcpa').innerHTML = final_cpa; 
     } 


    } 
} 




function getcredits(arr) { 
    var sum = 0; 
    var tbl_id = 'tbl_semester' + arr[0] + arr[1]; 
    $('#' + tbl_id + ' .sum').each(function() { 
     sum += parseInt($(this).text())||0; 
    }); 
    return sum; 
} 



function show_grade(module_percentage) { 
    if (isNaN(module_percentage)) { 
     return 'N/A'; 
    } 
    if (module_percentage >= 70 && module_percentage <= 100) { 
     return 'A'; 
    } else if (module_percentage >= 60 && module_percentage < 70) { 
     return 'B'; 
    } else if (module_percentage >= 50 && module_percentage < 60) { 
     return 'C'; 
    } else if (module_percentage >= 40 && module_percentage < 50) { 
     return 'D'; 
    } else { 
     return 'F'; 
    } 

} 

function show_award(cpa) { 
    if (isNaN(cpa)) { 
     return 'N/A'; 
    } 
    if (cpa >= 70 && cpa <= 100) { 
     return 'First Class with Honours'; 
    } else if (cpa >= 60 && cpa < 70) { 
     return 'Second Class First Division with Honours'; 
    } else if (cpa >= 50 && cpa < 60) { 
     return 'Second Class Second Division with Honours'; 
    } else if (cpa >= 45 && cpa < 50) { 
     return 'Third Class with Honours'; 
    } else if (cpa >= 40 && cpa < 45) { 
     return 'Pass'; 
    } else if (cpa < 40) { 
     return 'No award'; 
    } 

} 
+0

View source не показывает изменений, внесенных с помощью javascript. – ray

+0

@ray После того, как я обновляю HTML, как я могу сказать javascript, чтобы использовать 'new' HTML, не просматривать исходный код..Извините, если это не понятно ... JS noob здесь – user2650277

+0

JavaScript использует HTML как есть. Не путайте с функцией просмотра источника, предлагаемой браузерами: это не то, что JavaScript видит, если документ уже был изменен им. – trincot

ответ

0

вы должны быть уверены, что вы вызываете функцию после того, как документ будет готов. Кроме того, вы используете неназначенное значение.

</body> 
<script>  
function calculate_final_cpa() { 
     var final_cpa = 0; 
     $('.tmpcpa').each(function() { 
      if ($(this).val() != 0) 
      final_cpa += parseInt($(this).text()) || 0; 
     }); 
     return final_cpa; 
    } 

    $(document).ready(function(){ 
      var final_cpa = calculate_final_cpa(); 
    document.getElementById('cpa' + arr[0]).innerHTML = cpa + '(' + '<label id="tmpcpa">' + final_cpa + "</label>" +' For Final' + ')'; 
      console.log(final_cpa); 
    }); 
</script> 
+0

где я могу добавить '$ (document) .ready', если var final_cpa уже находится внутри функции – user2650277

+0

@ user2650277. Вы устанавливаете область действия final_cpa внутри функций. Поэтому не беспокойтесь об этом. поместите раздел $ (document) .ready сразу после того, как вы закрыли тег тела и внутри тега скрипта. Я отредактировал ответ для вашего удобства. – Mojtaba

+0

Я добавил, что весь мой JS может помочь мне решить, как решить проблему. – user2650277

Смежные вопросы