2012-04-23 4 views
1

, поэтому у меня есть очень простой скрипт, который я пишу, чтобы быть калькулятором, чтобы клиенты могли видеть, сколько будет стоить услуга, а затем обновить результат на основе изменений в текстовых вводах. проблема заключается в том, что после первого обхода он перестает правильно вычислять значения. Вот оно, поможет.простой калькулятор jquery калькулятор

<script> 
$(function(){ 


var one=0; 
var two=0; 
var three=0; 
$("input:text").change(function(){ 
if($(this).val() == $('#first').val()) 
{ 
one = parseInt($(this).val()); 



} 
else if($(this).val() == $('#second').val()){ 

two = parseInt($(this).val()); 

} 
else if($(this).val() == $('#third').val()){ 

three = parseInt($(this).val()); 

} 

}); 


$('input:text').change(function(){ 

$('#result').text(one+two+three); 


}); 


}); 


</script> 

и форма:

<div id="container"> 
<form action="something.html" id="subit"> 
<label for="first">put numbers</label><input type="text" id="first"/> 
<label for="second">more numbers</label><input type="text" id="second" value="0"/> 
<label for="third">and more numbers</label><input type="text" id="third" value="0"/> 
<input type="submit" /> 
</form> 
<div id="result"></> 
</div> 
+0

Вы меняете функцию 'change()' после первого запуска, правильно? – Marc

+0

Марк, что ты имеешь в виду? в основном то, что я пытаюсь сделать в первую очередь: присваивать значения переменным, а затем обновлять результат на основе добавления этих значений. –

+0

Проблема - это «счет», после первого раунда добавления. добавьте val 1, 2,3, а затем попробуйте изменить один раз, и результат будет неправильным. –

ответ

1

Попробуйте этот код

$(document).ready(function() { 
    var textboxes = $("#container input:text"); 
    textboxes.on("keyup", function() { 
     var amt = 0; 
     textboxes.each(function() { 
      amt += +$(this).val(); 
     }); 
     $("#result").html(amt); 
    }); 
});​ 

Рабочая Fiddle: http://jsfiddle.net/naveen/87p53/


Что касается вашего кода, изменить эти вещи в вашем коде

a. Сравните идентификаторы, а не ценности, гораздо безопаснее.
b. Удалите вторую функцию изменения. Не нужно вообще.

$(function() { 
    var one = 0; 
    var two = 0; 
    var three = 0; 
    $("input:text").change(function() { 
     if (this.id == "first") { 
      one = parseInt($(this).val()); 
     } 
     else if (this.id == "second") { 
      two = parseInt($(this).val()); 
     } 
     else if (this.id == "third") { 
      three = parseInt($(this).val()); 
     } 
     $('#result').html(one + two + three); 
    }); 
});​ 
+0

Naveen Awesome! очень лаконично. –

+0

любой шанс, который вы знаете, почему код, который я написал, не работает? –

+0

еще раз спасибо, всегда приятно учиться. –

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