teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

1

追記

2018/02/26 03:11

投稿

yambejp
yambejp

スコア117885

answer CHANGED
@@ -40,4 +40,32 @@
40
40
  <div class="third" id="bus_normal">バス</div>
41
41
  <div class="third" id="train_high">高級電車</div>
42
42
  <div class="third" id="train_normal">電車</div>
43
+ ```
44
+
45
+ # 追記
46
+ ちょっと検証しましたが
47
+ チェックボタン変更した時に下位のチェックボタンをクリアしないとおかしいですね
48
+
49
+ ```javascript
50
+ document.addEventListener('change',function(e){
51
+ var t=e.target;
52
+ if(t.name=="move"){
53
+ Array.prototype.forEach.call(document.querySelectorAll('.second,.third'),function(x){
54
+ if(x.id==t.value){
55
+ x.style.display="block";
56
+ Array.prototype.forEach.call(x.querySelectorAll('[type=radio]'),function(y){
57
+ y.checked=false;
58
+ });
59
+ }else{
60
+ x.style.display="none";
61
+ }
62
+ });
63
+ }
64
+ if(t.name=="grade"){
65
+ Array.prototype.forEach.call(document.querySelectorAll('.third'),function(x){
66
+ x.style.display=(x.id==t.value)?"block":"none";
67
+ });
68
+ }
69
+ });
70
+
43
71
  ```