使用jQuery

时间:2016-06-13 09:18:35

标签: jquery html

我目前正在一个租赁工具的学校项目中工作。我正在开帐单页面,我需要从一些输入中获得总数。下面是它的样子,我需要使用jQuery获得总数。

enter image description here

4 个答案:

答案 0 :(得分:1)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
 $(document).ready(function(e) {
   var sum=0;$('.add').blur(function(e) {
   var n=parseInt($(this).val(),10);
sum=sum+n;
$('.sum').val(sum);
});});


<table><tr>
<td><input type="number" name="number1" class="add" /></td>
<td><input type="number" name="number2" class="add"  /></td>
<td><input type="number" name="number3" class="add"  /></td>
<td><input type="number" name="number4" class="add"  /></td>
<td><input type="number" name="number4" class="sum"  /></td>
</tr></table>

答案 1 :(得分:0)

您可以使用:

$('.total').val(function(){

  var v = 0;

  $(this).closest('tr').find('input:not(:disabled)').each(function(){
     v += parseInt(this.value, 10);
  });

  return v;

});

猜测表中的tr元素中有所有输入。

答案 2 :(得分:0)

您可以尝试此代码

<强> HTML

<div id="textFields">
    <span>
       <input type="text" class="inpt" name="inpt1" value="0">
    </span>
    <span>
      <input type="text" class="inpt" name="inpt2" value="0" />
   </span>
    <span>
       <input type="text" class="inpt" name="inpt3" value="0" />
   </span>
</div>
<div class="total">
   <input type="text" disabled="disabled" class="sumation" />
</div>

JS代码

$("body").on("keyup",".inpt",function(){
  var total=0;
  $.each($('.inpt'),function(k,v){
         total=total+parseInt($(v).val());
});
$(".sumation").val(total);

});

工作fiddle

答案 3 :(得分:0)

这么多的可能性..

for (var i = 0; i < 4; i++) {
  $('selektor').append('<input class="input" type="text" name="name' + i + '">')
}
$('selektor').append('<input id="total" class="total" type="text" name="total">')
$('.input').on('keyup', function () {
  var sum = 0;
  $('.input').each(function () {
    if (isNaN($(this).val())) return;
    sum += $(this).val() - 0;
  })
  $('#total').val(sum);
})