javascript - 如何在单击复选框后显示输入框 [HTML]

Question

我的体内有这段代码 - 我想仅在选中复选框时显示输入框，然后在取消选中后再次消失。

<input type="checkbox" name="exercheckbox">THISCHECKBOX

<!-- show this input box --> <input type="text" name="reps">

我已经看到了使用 javascript 实现这一点的方法，但是我没有这种语言的经验，所以我不确定如何实现和调整该代码，以便它与我的复选框一起使用。有没有办法使用 HTML 来做到这一点？如果不是，我该如何使用 javascript 来做到这一点？

Answer 1

您也可以使用像这样的纯 CSS 解决方案。

<input type="checkbox" name="exercheckbox" id="exercheckbox">THISCHECKBOX</input>

<input type="text" name="reps" id="reps" />

CSS:

#reps{
    display: none;
}
 #exercheckbox:checked ~ #reps{
    display: block;
}