質問編集履歴

2

質問内容の改善,ソースコード追加

2017/05/11 12:24

投稿

TKlosu
TKlosu

スコア8

test CHANGED
File without changes
test CHANGED
@@ -1,8 +1,10 @@
1
1
  ###実現したいこと
2
2
 
3
- 文字をクリックすると特定の文字を表示し、た、他の同じ仕様の文字をクリックると同じ場所に先程の文字を自動的に消して表示したい
3
+ TEST1,2,3それぞれクリックするとTESTtext1,2,3が表示されます
4
4
 
5
- 下記コードを複数個書(タブ名,ID名は変更)こを前提
5
+ Test1を開いた状態ときにTEST2開くとTESTtext1の下にTESTtext2が表示されます。
6
+
7
+ その場合にTESTtext1を自動的に閉じてTESTtext2を表示させたい。(TEST2→TEST3, TEST3→TEST1, etc...も同様)
6
8
 
7
9
 
8
10
 
@@ -24,16 +26,44 @@
24
26
 
25
27
  ```HTML
26
28
 
27
- <div onclick="obj=document.getElementById('open').style; obj.display=(obj.display=='none')?'block':'none';">
29
+ <div onclick="obj=document.getElementById('open1').style; obj.display=(obj.display=='none')?'block':'none';">
28
30
 
29
- <li><a href="#1" style="cursor:pointer;">TEST</a></li></div>
31
+ <li><a href="#1" style="cursor:pointer;">TEST1</a></li></div>
30
32
 
31
33
 
32
34
 
33
- <div id="open" style="display:none;clear:both;">
35
+ <div id="open1" style="display:none;clear:both;">
34
36
 
35
- TESTtext
37
+ TESTtext1
36
38
 
37
39
  </div>
38
40
 
41
+
42
+
43
+ <div onclick="obj=document.getElementById('open2').style; obj.display=(obj.display=='none')?'block':'none';">
44
+
45
+ <li><a href="#1" style="cursor:pointer;">TEST2</a></li></div>
46
+
47
+
48
+
49
+ <div id="open2" style="display:none;clear:both;">
50
+
51
+ TESTtext2
52
+
53
+ </div>
54
+
55
+
56
+
57
+ <div onclick="obj=document.getElementById('open3').style; obj.display=(obj.display=='none')?'block':'none';">
58
+
59
+ <li><a href="#1" style="cursor:pointer;">TEST3</a></li></div>
60
+
61
+
62
+
63
+ <div id="open3" style="display:none;clear:both;">
64
+
65
+ TESTtext3
66
+
67
+ </div>
68
+
39
69
  ```

1

書式の修正

2017/05/11 12:24

投稿

TKlosu
TKlosu

スコア8

test CHANGED
File without changes
test CHANGED
@@ -22,9 +22,7 @@
22
22
 
23
23
  ###該当のソースコード
24
24
 
25
- 言語・・・HTML,CSS
25
+ ```HTML
26
-
27
-
28
26
 
29
27
  <div onclick="obj=document.getElementById('open').style; obj.display=(obj.display=='none')?'block':'none';">
30
28
 
@@ -37,3 +35,5 @@
37
35
  TESTtext
38
36
 
39
37
  </div>
38
+
39
+ ```