入力[番号]フィールドを別の入力[番号]フィールドに依存するJQuery

Question

すべてinputフィールドは、合計クイズマーク（inputフィールド）に依存する必要があります。私はちょうどattribute: maxを設定して、less than or equal toの合計クイズマークにする必要があります。 スナップショットを添付しています&私はそれが明らかになると確信しています。

&私も自分のhtmlコードを付加しています：

<form action="../controllers/classroom.php" method="POST">  
    <input type="number" class="form-control" id="totalMark" name="totalMark" placeholder="Enter quiz mark" required> 
    <div class="row"> 
    <?php 
     $count=0; 
     $query4="SELECT * FROM enrollments WHERE classId='{$classId}'"; 
     $res4=mysqli_query($connection, $query4); 

     while($row=mysqli_fetch_array($res4)){ 
      $count++; 
    ?> 
      <div class="col-md-2">#<?php echo $count; ?></div> 
      <div class="col-md-6"><?php echo ucwords(getUser($row['userId'])['name']); ?></div> 
      <div class="col-md-4"><input type="number" class="form-control" name="user[<?php echo $row['id']; ?>]" placeholder="Enter marks" required> 
      </div> 
    <?php } ?> 
    </div> 
    <button type="submit" name="quiz-marks" class="btn btn-primary">Submit</button> 
</form> 

は私が生きて検証を作りたいです。ありがとう

Answer 1

の入力でchangeイベントを聞き、次にmaxプロパティを変更することです。簡潔にするためにjQueryを使用しましたが、必要であればバニラのjavascriptを使用できると確信しています。

$(function(){ 
 
\t $('#totalMark').change(function(){ 
 
\t \t $('.form-control:not(#totalMark)').prop('max',this.value) 
 
\t }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
 
    <input type="number" class="form-control" id="totalMark" name="totalMark" value="20" placeholder="Enter quiz mark" required> 
 
    <input type="number" class="form-control" max="20" required> 
 
    <input type="number" class="form-control" max="20" required> 
 
    <input type="number" class="form-control" max="20" required> 
 
</form>