如何按百分比增加或减少所有字段值

Question

$("button").on("click",function(){
    var $this=$(this);
    var Per=$(".per").val();
    $(".anuzau").each(function(){
      var Val=$(this).val();
      if($this.hasClass("zau"))
       $(this).val((((Val/100)*Per)+parseInt(Val)).toFixed(2));
      else if($this.hasClass("anu"))
       $(this).val((parseInt(Val)-((Val/100)*Per)).toFixed(2));
    });
});

.anuzau{width:200px;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="anu">-</button> <input class="per" type="text" size="6" value="0">%
<button class="zau">+</button>
<br><br>
<input type="text" size="6" class="anuzau" name="name" value="38.5"><br>
<input type="text" size="6" class="anuzau" name="name" value="75"><br>
<input type="text" size="6" class="anuzau" name="name" value="100">

我希望通过类名（anu zau）增加/减少所有值，任何人都可以分享我的jquery方法吗？我尝试了很多教程。我是新来的，如果有什么不对的地方，请纠正我。

<button class="anu">-</button> <input type="text" size="6" value="">%
<button class="zau">+</button>
<br><br>
<td><input type="text" size="6" class="anu zau" name="name" id="id" value="50"></td><br>
<td><input type="text" size="6" class="anu zau" name="name" id="id" value="200"></td><br>
<td><input type="text" size="6" class="anu zau" name="name" id="id" value="530"></td>

Answer 1

$("button").on("click",function(){
    var $this=$(this);
    var Per=$(".per").val();
    $(".anuzau").each(function(){
      var Val=$(this).val();
      if($this.hasClass("zau"))
       $(this).val((((Val/100)*Per)+parseInt(Val)));
      else if($this.hasClass("anu"))
       $(this).val((parseInt(Val)-((Val/100)*Per)));
    });
});

.anuzau{width:200px;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="anu">-</button> <input class="per" type="text" size="6" value="0">%
<button class="zau">+</button>
<br><br>
<input type="text" size="6" class="anuzau" name="name" value="50"><br>
<input type="text" size="6" class="anuzau" name="name" value="200"><br>
<input type="text" size="6" class="anuzau" name="name" value="530">

Answer 2

这应该让你开始。不清楚您正在寻找的精度（相应地调整decimal_points）

var decimal_points = 2
$('button').click(function(){
  var pVal = $('#percent').val(),
  percent = pVal && !isNaN(pVal) ? +pVal/100 : 0;
  //make it negative if anu button clicked
  if($(this).hasClass('anu')){
     percent = 0-percent;
  }
  $('input.anu').val(function(_, val){
     // make sure input has numeric value
     if(!val || isNaN(val) ){
       return val;
     }else{
       return (+val + (val * percent)).toFixed(decimal_points);
     }
  }); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="anu">-</button> <input id="percent" type="number" size="6" value="">%
<button class="zau">+</button>
<br><br>
<td><input type="text" size="6" class="anu zau" name="name" id="id" value="50"></td><br>
<td><input type="text" size="6" class="anu zau" name="name" id="id" value="200"></td><br>
<td><input type="text" size="6" class="anu zau" name="name" id="id" value="530"></td>