Question

我提前两天改进了我的代码。这段代码很好但这次我希望第三个字段或任何剩余的字段自动填入其余的点。我试图操纵但它只会导致负面影响。当我多次更改值时，我无法计算确切的值。非常感谢任何帮助。谢谢你。

<div class="col-lg-12">
    <div class="panel panel-default">
      <div class="panel-heading"> Please enter the weighted measurements for the criteria in selecting the scholars :</div>
      <div class="panel-body">
        <div class="col-lg-4 form-group">
          <label class="control-label">
            Total criteria :
          </label>
          {!! Form::text('point','100',['class'=>'form-control', 'id'=>'remaining','disabled']) !!}
        </div>
        <div>
          <div class="col-lg-12">

            <div class="col-lg-4 form-group">
              <label class="control-label">
                Percent for age: 
              </label>
              {!! Form::text('scholarship_points_one',null,['class'=>'form-control point','id'=>'f1','maxlength' => '3', 'min'=>'4', 'max'=>'100','placeholder'=>'Enter Your Rate 1 - 100']) !!}
            </div>

            <div class="col-lg-4 form-group">
              <label class="control-label">
               Percent for GPA: 
             </label>
             {!! Form::text('scholarship_points_two',null,['class'=>'form-control point','id'=>'f2','maxlength' => '3', 'min'=>'4', 'max'=>'100','placeholder'=>'Enter Your Rate 1 - 100']) !!}
           </div>

           <div class="col-lg-4 form-group">
            <label class="control-label">
             Percent for location: 
           </label>
           {!! Form::text('scholarship_points_three',null,['class'=>'form-control point','id'=>'f3','maxlength' => '3', 'min'=>'4', 'max'=>'100','placeholder'=>'Enter Your Rate 1 - 100']) !!}
         </div>
       </div>
     </div>
   </div>
 </div>
</div>

<script type="text/javascript">
  var points = document.getElementsByClassName('point');
  var remaining = document.getElementById('remaining');
  for(var i = 0; i < points.length; i++) {
    points[i].addEventListener('change', function() {
      var inputPoints = getInputPoints();
      remaining.value = 100 - inputPoints;
    });
  }
  function getInputPoints() {
    var inputPoints = 0;
    for(var j = 0; j < points.length; j++) {
      if (!isNaN(points[j].value) && points[j].value != "") { inputPoints += parseInt(points[j].value);}
    }
    return inputPoints;
  }
</script>

Answer 1

将类input-fields-to-sum添加到源输入字段，然后

<script>
$(document).ready(function() {
   calculateTotals();

    $(".input-fields-to-sum").on('input', function() {
        calculateTotals();
    });
});

function calculateTotals() {
   // walk on input fields with class, calculate sum and put it in total field
   // input can contain invalid numbers, handle errors when parsing
}

function parseNumber(str, defaultValue) {
    if (str !== undefined && str.length) {
        var parsed = parseFloat(str.replace(',','.').replace(/\s/g,'').replace(/\&nbsp\;/g,''));
        if (isNaN(parsed)) return defaultValue;
        return parsed;
    }
    return defaultValue;
}
</script>

在JavaScript中自动填充计算值

1 个答案: