如何在HTML5中制作特定单选按钮，并在手动添加数据时自动选择“指定”

Question

我正在开发一个Web界面，用于以这样的方式获取输入，即想象有三个具有特定功能的单选按钮，其中一个无线电输入功能也随之输入数字。看看例子：

<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>

实际上这是有效的，但我希望我的网站更加智能和动态，所以主要问题是我从选择中选择一个数字的那一刻，它应该自动标记指定单选按钮，但它不会。如果我我选择一个或两个作为我的选择，它应该使用空白界面禁用数字输入。

Answer 1

我想你想要这样的东西

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>