首页 > 解决方案 > 修改外部内容

,但没有 JavaScript 我有一个看起来像这样的 HTML 页面, <select id="selectMe"> <option value="option1">Question 1</option> <option value="option2">Question 2</option > <option value="option3">问题3</option> </se

问题描述

标签: javascripthtmlcss

解决方案


我的意思是有一种方式(并不完全以此为荣),但使用radio按钮可以帮助我们使用伪选择器跟踪checked状态。:checked我们可以使用相同的映射 from question1tooption1等等。

.options{
display:none;
}
#question1:checked ~ #option1,
#question2:checked ~ #option2,
#question3:checked ~ #option3{
display:block;
}
<input type="radio" name="questions" id="question1" checked/>
<label for="question1">Quesion 1</label>

<input type="radio" name="questions" id="question2"/>
<label for="question2">Question 2</label>

<input type="radio" name="questions" id="question3"/>
<label for="question3">Question 3</label>

<div id="option1" class="options">Answer 1</div>
<div id="option2" class="options">Answer 2</div>
<div id="option3" class="options">Answer 3</div>


推荐阅读