javascript - 修改外部内容和
问题描述
解决方案
我的意思是有一种方式(并不完全以此为荣),但使用radio
按钮可以帮助我们使用伪选择器跟踪checked
状态。:checked
我们可以使用相同的映射 from question1
tooption1
等等。
.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>
推荐阅读
- regex - 替换前几位生日熊猫
- linq - 如何创建具有多个条件 Where 子句的 Linq 查询
- vue.js - vue js应用中没有定义axios
- javascript - 将列表传递给视图后如何转换 C# 列表?
- django - 如何在django2.2中添加外部css/js
- r - 使用 sf 包连接线和多边形
- python - Django 2.2 - 测试用例 - client.logout() 方法不注销用户
- .net - ASP.NET Core MVC - 使用 IClientModelValidator 创建 RequiredIf 属性
- c++ - 如何多次将fstream传递给函数
- python - 如何使用添加到熊猫数据框中的每日数据来增量计算移动平均值?
问题描述
我的意思是有一种方式(并不完全以此为荣),但使用radio
按钮可以帮助我们使用伪选择器跟踪checked
状态。:checked
我们可以使用相同的映射 from question1
tooption1
等等。
.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>