2015-01-15 5 views
0

Хорошо, у меня есть этот код, который отлично работает в определенной точке.Javascript вычисляет сумму всех полей ввода с определенным классом

$(document).ready(function(){ 
      var val1 = +$(".charge").val(); 
      var val2 = +$(".fee").val(); 
      var val3 = +$(".loadrate").val(); 
      $("#finalrate").val(val1-val2+val3); 
    $(".financeinput").keyup.each(function(){ 
      var val1 = +$(".charge").val(); 
      var val2 = +$(".fee").val(); 
      var val3 = +$(".loadrate").val(); 
      var initial = $("#finalrate").val(); 

      $("#finalrate").val(val1-val2+val3); 

      var second = $("#finalrate").val(); 

      if(initial < second){ 

      $("#finalrate").removeClass("redardown").addClass("greenarup"); 

      } 
      if(initial > second){ 

      $("#finalrate").removeClass("greenarup").addClass("redardown"); 

      } 
      if(initial = second){ 

      } 

    }); 
}); 

У меня есть несколько полей с классом «.charge» и несколько полями с классом «.fee», но здесь код получает только значение первых полей с этим классом, в то время как мне нужен их все рассчитываться. Я знаю, это должно быть очень легко, но я довольно новичок в javascript.

ответ

1

Вы должны использовать .each на входах 'charge' и 'fee'.

$(".charge").each(function() 
{ 
    $(this).val(); // this should have value for current input 
} 

here is a link that shows how to use the each function

Вот пример, так что вы можете увидеть, как это работает:

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<meta http-equiv="cache-control" content="max-age=0" /> 
<meta http-equiv="cache-control" content="no-cache" /> 
<meta http-equiv="expires" content="0" /> 
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" /> 
<meta http-equiv="pragma" content="no-cache" /> 
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> 
<title>Login</title> 
</head> 
<body> 
<input class="test" type="text" value="2"> 
<input class="test" type="text" value="3"> 
<input class="test" type="text" value="4"> 
</body> 
<script type="text/javascript"> 
var test1 = 0; 
$(".test").each(function(){ 
    test1 += parseInt($(this).val()); 
}); 
window.alert("" + test1); 
</script> 
</html> 

Я не знаю точно, что вы пытаетесь сделать, но вы можете что-то вроде этого:

var val1 = 0; 
$(".charge").each(function(){ 
    val1 += parseInt($(this).val()); 
}); 
window.alert("" + val1); // should have all .charge added up here 
+0

я получаю NaN результат –

+0

Поскольку метод ничего не возвращает ... – brso05

+0

Дайте мне секунду Я пытаюсь опубликовать пример – brso05

0

это просто псевдокод, но в основном ваше решение может выглядеть следующим образом (чисто JS)

var x = document.getElementsByClassName("charge"); 
for(var i = 0; i<x.length; i++){ 
    sum += x[i].value; 
} 

и просто сделать это для всех классов, вам нужно

+0

Ваш ответ, вероятно, правильный, но я получаю NaN. Ты знаешь почему? –

+0

Знаете ли вы, как использовать инструменты разработчика с точками разрыва? Трудно определить без html – user2879041