回答編集履歴

5

修正漏れ

2020/09/29 09:35

投稿

kuma_kuma_
kuma_kuma_

スコア2506

test CHANGED
@@ -146,17 +146,17 @@
146
146
 
147
147
  tds[itd].addEventListener('click', {name: this, handleEvent: winorlose_click});
148
148
 
149
- // ※ここで設定
149
+ // ※ここで設定
150
150
 
151
- if(json_data[arr[1]][arr[2]]["WinOrLose"] == 1){
151
+ if(json_data['_'+ arr[1]]['_'+ arr[2]]["WinOrLose"] == 1){
152
152
 
153
- tds[itd].innerHTML = "○";
153
+ tds[itd].innerHTML = "○";
154
154
 
155
- } else {
155
+ } else if(json_data['_'+ arr[1]]['_'+ arr[2]]["WinOrLose"] == -1){
156
156
 
157
- tds[itd].innerHTML = "×";
157
+ tds[itd].innerHTML = "×";
158
158
 
159
- }
159
+ }
160
160
 
161
161
  }
162
162
 

4

追記

2020/09/29 09:35

投稿

kuma_kuma_
kuma_kuma_

スコア2506

test CHANGED
@@ -99,3 +99,73 @@
99
99
  JSON構造が階層構造だから難しく感じるかもしれないけれど
100
100
 
101
101
  なれるととても便利だから頑張って覚えてね!
102
+
103
+
104
+
105
+ 追記2
106
+
107
+ 前の回答の内容に追記しました(※部分)
108
+
109
+ (ここは学習ポイントなので自力でがんばってほしかった...)
110
+
111
+ ```Javascript
112
+
113
+ // 初期処理
114
+
115
+ function init(){
116
+
117
+ var trs = document.getElementById("winorlose_table").getElementsByTagName('tr');
118
+
119
+ // 1行目はヘッダーだから飛ばして
120
+
121
+ for(var itr = 1; itr < trs.length; itr++){
122
+
123
+ // テーブルの行毎に処理
124
+
125
+ var tds = trs[itr].getElementsByTagName('td');
126
+
127
+ for(var itd = 0; itd < tds.length; itd++){
128
+
129
+ if(tds[itd].id.indexOf('cell_') != -1){
130
+
131
+ // 勝ち負け入力<td>タグの場合
132
+
133
+ var arr = tds[itd].id.split('_');
134
+
135
+ if(arr[1] == arr[2]){
136
+
137
+ // 対戦が同じ場合
138
+
139
+ tds[itd].classList.add('right_up_border'); // 斜め線を指定
140
+
141
+ }else{
142
+
143
+ // 対戦が違う場合、イベントを登録
144
+
145
+ // onclick="winorlose_click(this);" とおんなじ内容
146
+
147
+ tds[itd].addEventListener('click', {name: this, handleEvent: winorlose_click});
148
+
149
+ // ※ここで設定
150
+
151
+ if(json_data[arr[1]][arr[2]]["WinOrLose"] == 1){
152
+
153
+ tds[itd].innerHTML = "○";
154
+
155
+ } else {
156
+
157
+ tds[itd].innerHTML = "×";
158
+
159
+ }
160
+
161
+ }
162
+
163
+ }
164
+
165
+ }
166
+
167
+ }
168
+
169
+ }
170
+
171
+ ```

3

修正

2020/09/28 19:39

投稿

kuma_kuma_
kuma_kuma_

スコア2506

test CHANGED
@@ -17,6 +17,8 @@
17
17
  勝ち = 1
18
18
 
19
19
  負け = -1
20
+
21
+ 未設定 = 0
20
22
 
21
23
  同一 = 9
22
24
 

2

修正漏れ

2020/09/28 18:44

投稿

kuma_kuma_
kuma_kuma_

スコア2506

test CHANGED
@@ -7,6 +7,8 @@
7
7
  JSON形式の値"○""●"を設定すればよいだけです。
8
8
 
9
9
 
10
+
11
+ 追記
10
12
 
11
13
  JSONデータの持ち方
12
14
 

1

追記

2020/09/28 18:41

投稿

kuma_kuma_
kuma_kuma_

スコア2506

test CHANGED
@@ -5,3 +5,93 @@
5
5
  あとは以前回答したinitのイベント設定時に受け取った
6
6
 
7
7
  JSON形式の値"○""●"を設定すればよいだけです。
8
+
9
+
10
+
11
+ JSONデータの持ち方
12
+
13
+ "WinOrLose"は
14
+
15
+ 勝ち = 1
16
+
17
+ 負け = -1
18
+
19
+ 同一 = 9
20
+
21
+ で設定したとして
22
+
23
+ ```Javascript
24
+
25
+ var json_data = {"_1":{
26
+
27
+ "member":"Aさん",
28
+
29
+ "_1":{"member":"Aさん","WinOrLose":9},
30
+
31
+ "_2":{"member":"Bさん","WinOrLose":1},
32
+
33
+ "_3":{"member":"Cさん","WinOrLose":-1}
34
+
35
+ },
36
+
37
+ "_2":{
38
+
39
+ "member":"Bさん",
40
+
41
+ "_1":{"member":"Aさん","WinOrLose":-1},
42
+
43
+ "_2":{"member":"Bさん","WinOrLose":9},
44
+
45
+ "_3":{"member":"Cさん","WinOrLose":1}
46
+
47
+ },
48
+
49
+ "_3":{
50
+
51
+ "member":"Cさん",
52
+
53
+ "_1":{"member":"Aさん","WinOrLose":1},
54
+
55
+ "_2":{"member":"Bさん","WinOrLose":-1},
56
+
57
+ "_3":{"member":"Cさん","WinOrLose":9}
58
+
59
+ }
60
+
61
+ };
62
+
63
+ ```
64
+
65
+ という形になります。
66
+
67
+ これはDBから取得したデータそのままの構造です。
68
+
69
+
70
+
71
+ 検索する際にはこの様に使います
72
+
73
+ ```Javascript
74
+
75
+ console.log(json_data["_1"]["member"]);
76
+
77
+ // 行"_1"のメンバーは? "Aさん"
78
+
79
+
80
+
81
+ console.log(json_data["_1"]["_3"]["member"]);
82
+
83
+ // 行"_1"列"_3"のメンバーは? "Cさん"
84
+
85
+
86
+
87
+ console.log(json_data["_2"]["_1"]["WinOrLose"]);
88
+
89
+ // 行"_2"列"_1"の勝敗は? -1(負け)
90
+
91
+ ```
92
+
93
+
94
+
95
+ JSON構造が階層構造だから難しく感じるかもしれないけれど
96
+
97
+ なれるととても便利だから頑張って覚えてね!