2017-11-27 34 views
0

このフォームには複数の入力があります。私は入力1を入力2の前に設定しなければならないようにしたい。Idは、入力1が入力されるまで入力2を読み取り専用にしたい。ユーザーが入力を入力する順序を制御する方法

<form> 
 
    Input-1:<br> 
 
    <input type="text" name="first" id="one"><br> 
 
    Input-2:<br> 
 
    <input type="text" name="second" id="two" readonly> 
 
</form>

イム私はこれを達成することができます方法がわかりません。 Jquery?

+1

、あなたは**のコードを記述しようとすると予想されていますあなた自身**。 ** [もっと研究をして](// meta.stackoverflow.com/questions/261592)**あなたが問題を抱えていると、あなたが試みたものを投稿することができます** **最小限の、完全な、広告の検証可能な例](// stackoverflow.com/help/mcve)*を提供しています。 – Rob

答えて

0

このためにjQueryは必要ありません。バニラJSでそれを達成するための一つの方法は次のように次のようになりますように(赤readonly、緑の平均OKを意味する)

document.querySelector('#one').onchange = (ev) => { 
 
    if(ev.target.value !== '') { 
 
    document.querySelector('#two').readOnly = false; 
 
    } else { 
 
    document.querySelector('#two').readOnly = true; 
 
    } 
 
};
#two[readonly] { 
 
    background-color: rgba(255, 69, 0, 0.5); 
 
} 
 
#two { 
 
    background-color: rgba(76, 187, 23, 0.5); 
 
}
<input type="text" id="one"><br> 
 
<input type="text" id="two" readonly>

関連する問題