複数入力の平均値

Question

idを "html"とすると、すべての入力の平均値が表示されます。 「calc」ボタンをクリックすると、追加されたものも含めて。どうすればいい？また、非数字が入力に受け入れられないようにするにはどうすればよいですか？

$(document).ready(function(){ 
 
    $('#new').click(function(){ 
 
    $('#inp').append("<input type='text' value='0' id='in'>") 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<h1 id='totes'>0</h1> 
 
<div id='inp'> 
 
    <input type='text' value='0' id='in'> 
 
</div> 
 
<button id='new'>Create</button> 
 
<button id='calc'>Calculate</button>

Answer 1

に番号を入力させnumber.Itsへの入力の種類を変更するため

次に計算ボタンにtotes IDに平均値を追加します

もう1つの解決方法があります。

$(document).ready(function(){ 
 
    $('#create').click(function(){ 
 
     $('#inp').append("<input type='text' value='0' />"); 
 
    }); 
 
    
 
    $('#calc').click(function(){ 
 
    var sum = 0; 
 
    var cnt = 0; 
 
    $('input[type="text"]').each(function(){ 
 
     sum += parseInt($(this).val()); 
 
     cnt++; 
 
    }); 
 
    
 
    $('#totes').html(sum/cnt); 
 
    }); 
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<h1 id='totes'> 
 
0 
 
</h1> 
 
<div id='inp'> 
 
    <input type='text' value='0' id='in' /> 
 
</div> 
 
<button id='create'>Create</button> 
 
<button id='calc'>Calculate</button>

希望すると、これが役に立ちます。

Answer 2

いくつかの変数にすべての入力値を算出し、この

1. のように試してみてください。
2. をクリック単にのみ入力

$(document).ready(function() { 
 
    $('#new').click(function() { 
 
    $('#inp').append("<input type='number' value='0' >") 
 
    }); 
 
    var t=0; 
 
    $('#calc').click(function(){ 
 
    $('input').each(function(){ 
 
     t +=parseFloat($(this).val()|0) 
 
    }) 
 
    $('#totes').html(t/ $('input').length) 
 
    
 
    }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<h1 id='totes'> 
 
    0 
 
</h1> 
 
<div id='inp'> 
 
    <input type='number' value='0' > 
 
</div> 
 
<button id='new'> 
 
Create 
 
</button> 
 
<button id='calc'> 
 
Calculate 
 
</button>

Answer 3

Here is your answer : 
<h1 id='totes'> 0 </h1> 
<div id='inp'> 
    <input type='text' value='' id='in' onkeypress="return isNumber(event)" > 
</div> 
<button id='new'> 
    Create 
</button> 
<button id='calc'> 
    Calculate 
</button> 

<script type="text/javascript">  
    $(document).ready(function(){ 
     $('#new').click(function(){ 
      var inValue = $('#in').val(); 
      $('#inp').append("<input type='text' class='newin' value='"+ inValue +"'>"); 
     }); 

     $('#calc').click(function(){ 
      var total = 0; 
      var valid_labels = 0; 
      var average; 

      $('input').each(function() { 
       var val = parseInt($(this).val(), 10); 
       if (!isNaN(val)) { 
        valid_labels += 1; 
        total += val; 
       } 
      }); 

      average = total/valid_labels; 
      $('#totes').text(average); 
     }); 
    }); 

    function isNumber(evt) { 
     evt = (evt) ? evt : window.event; 
     var charCode = (evt.which) ? evt.which : evt.keyCode; 
     if (charCode > 31 && (charCode < 48 || charCode > 57)) { 
      return false; 
     } 
     return true; 
    } 
</script>