はどのように私は数テキストボックスに数字を制御することができますの<input type =「数」/>別のテキストボックス

Question

What i need is when the room quantity is set to 1, the adult max range be 3 and min range be 1. And when room quantity is set to 2, the adult max range be 6 and min range be 1. Can someone plz help me with javascript or jquery that is needed to solve this problem.

Answer 1

あなたは、この例のいくつかの機能を使用することができますで行わ増分および漸減変化に従って。これは洗練された解決策ではなく、maxプロパティの操作方法の例です。input要素です。

$("#roomsInput").change(function() { 
 
\t var maxAdults; 
 
    var roomsSelected = $(this).val(); 
 
    if (roomsSelected == 1) { 
 
    \t maxAdults = 3; 
 
    } else if (roomsSelected == 2) { 
 
    \t maxAdults = 6; 
 
    } else { 
 
    \t maxAdults = 10; 
 
    } 
 
    var adultsInput = $("#adultsInput"); 
 
    if (adultsInput.val() > maxAdults) { 
 
    \t adultsInput.val(maxAdults); 
 
    } 
 
    adultsInput.prop("max", maxAdults); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div> 
 
    <label>Rooms</label> 
 
    <input type="number" id="roomsInput" min="1" max="3"> 
 
</div> 
 
<div> 
 
    <label>Adults</label> 
 
    <input type="number" id="adultsInput" min="0" max="10"> 
 
</div> 
 
<div> 
 
    <label>Kids</label> 
 
    <input type="number" id="kidsInput" min="0" max="10"> 
 
</div>