質問編集履歴
1
追記
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -175,3 +175,67 @@
|
|
|
175
175
|
### 補足情報（FW/ツールのバージョンなど）
|
|
176
176
|
|
|
177
177
|
Bootstrap4
|
|
178
|
+
|
|
179
|
+
|
|
180
|
+
|
|
181
|
+
|
|
182
|
+
|
|
183
|
+
### 追記
|
|
184
|
+
|
|
185
|
+
```
|
|
186
|
+
|
|
187
|
+
<div class="accordion" id="accordion" role="tablist" aria-multiselectable="true">
|
|
188
|
+
|
|
189
|
+
|
|
190
|
+
|
|
191
|
+
<div th:each="node, status : ${nodes}" class="card" th:with="collapseId = 'collapse' + ${status.count}">
|
|
192
|
+
|
|
193
|
+
<div class="card-header" role="tab" id="headingOne">
|
|
194
|
+
|
|
195
|
+
<h5 class="mb-0">
|
|
196
|
+
|
|
197
|
+
<a class="text-body d-block p-3 m-n3" data-toggle="collapse" th:href="'#' + ${collapseId}"
|
|
198
|
+
|
|
199
|
+
role="button" aria-expanded="false" th:attr="aria-controls= ${collapseId}">
|
|
200
|
+
|
|
201
|
+
[[${node.key}]]
|
|
202
|
+
|
|
203
|
+
</a>
|
|
204
|
+
|
|
205
|
+
</h5>
|
|
206
|
+
|
|
207
|
+
</div><!-- /.card-header -->
|
|
208
|
+
|
|
209
|
+
<div th:id="${collapseId}" class="collapse show" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordion">
|
|
210
|
+
|
|
211
|
+
<div class="card-body">
|
|
212
|
+
|
|
213
|
+
<a th:each="value : ${node.value}" class="dropdown-item">[[${value}]] </a>
|
|
214
|
+
|
|
215
|
+
</div><!-- /.card-body -->
|
|
216
|
+
|
|
217
|
+
</div><!-- /.collapse -->
|
|
218
|
+
|
|
219
|
+
</div><!-- /.card -->
|
|
220
|
+
|
|
221
|
+
```
|
|
222
|
+
|
|
223
|
+
としたことでこの問題は解決できました。
|
|
224
|
+
|
|
225
|
+
ありがとうございます。
|
|
226
|
+
|
|
227
|
+
|
|
228
|
+
|
|
229
|
+
さらにもしわかれば教えていただきたいのですが
|
|
230
|
+
|
|
231
|
+
```
|
|
232
|
+
|
|
233
|
+
a[data-toggle="collapse"] に、
|
|
234
|
+
|
|
235
|
+
aria-expanded="false" 属性（支援技術に要素の開閉の状態を伝える）
|
|
236
|
+
|
|
237
|
+
```
|
|
238
|
+
|
|
239
|
+
という記載があったのでaria-expanded="false"を設定してみたのですが初期状態でアコーディオンが開かれた状態のままでした。
|
|
240
|
+
|
|
241
|
+
初期で閉じておくにはこの指定の仕方ではだめなのでしょうか？
|