如何在 HTML5 中创建特定的单选按钮，并在手动添加数据时自动选择指定

Question

我正在开发一个网络界面，以这样一种方式进行输入，想象一下有三个具有特定功能的单选按钮，其中一个单选输入功能也有数字输入。看例子：

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

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

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>

如何在 HTML5 中创建特定的单选按钮，并在手动添加数据时自动选择指定

How to make specific radio button in HTML5 with automatically selecting Specify while manually adding data

html

forms

frontend

web-frontend