Как сделать конкретный переключатель в HTML5 с автоматическим выбором «Указать» при добавлении данных вручную - PullRequest
Новая
       10

Как сделать конкретный переключатель в HTML5 с автоматическим выбором «Указать» при добавлении данных вручную

0 голосов
/ 10 мая 2018

Я работаю над веб-интерфейсом для ввода данных таким образом, что представьте, что есть три переключателя с определенными функциями, и одна из функций радиовхода также имеет цифровой ввод вместе с ним. Взгляните на пример: 

<h2>How many cars you own?</h2>

<form>
<input type="radio" name="car" checked>One<br>
<input type="radio" name="car">Two<br>
<input type="radio" name="car">Specify
<input type="number" name="car"><br>
</form>

На самом деле это работает, но я хочу, чтобы мой веб-сайт был немного более умным и динамичным, поэтому главная проблема - это момент, когда я выбираю число в поле «Выбрать», оно должно автоматически отмечать переключатель «Указать», но это не так. 't . И если я выбираю Один или Два в качестве своего выбора, он должен отключить ввод числа с пустым интерфейсом.

1 Ответ

0 голосов
/ 10 мая 2018

Я думаю, вы хотите что-то вроде этого 

var cars = document.getElementsByName("car");

cars[3].addEventListener("input", function(e) {

  if (e.target.value < 1) {
    e.target.value = 1;
  }

  if (e.target.value === 1) {
    cars[2].checked = true;
  } else {
    cars[e.target.value - 1].checked = true;
  }

});
<h2>How many cars you own?</h2>

<form>
  <input type="radio" name="car" checked>One<br>
  <input type="radio" name="car">Two<br>
  <input type="radio" name="car">Specify
  <input type="number" name="car" value="1"><br>
</form>
...