There is such a code

<div id="some" class="some"> <label for="some">Заголовок</label> <p> <label> <input type="radio" class="input_radio" name="some_radio" value="0" checked="checked" /> <span class="radio-custom"></span> <span class="label">Выбрать 0</span> </label> </p> <p> <label> <input type="radio" class="input_radio" name="some_radio" value="1"> <span class="radio-custom"></span> <span class="label">Выбрать 1 </span> <input type="text" class="input" name="price" value=""> </label> </p> </div>

Tell me how to implement the automatic installation of the second radio button when you click on the input field?

Thank.

    1 answer 1

     var input = document.getElementsByClassName('input')[0], inputRadio = document.getElementsByClassName('input_radio'); input.addEventListener('focus', () => { inputRadio[1].checked = 1; }) input.addEventListener('blur', () => { if (input.value == '') { inputRadio[0].checked = 1; } }) 
     <div id="some" class="some"> <label for="some">Заголовок</label> <p> <label> <input type="radio" class="input_radio" name="some_radio" checked="checked" /> <span class="radio-custom"></span> <span class="label">Выбрать 0</span> </label> </p> <p> <label> <input type="radio" class="input_radio" name="some_radio"/> <span class="radio-custom"></span> <span class="label">Выбрать 1 </span> <input type="text" class="input" name="price" value=""> </label> </p> </div>

    • It worked. But if you install the first button and then click on the field, it no longer works. - WA-A