質問編集履歴

2

質問文を具体的に

2022/05/31 04:29

投稿

shin12t
shin12t

スコア25

test CHANGED
File without changes
test CHANGED
@@ -4,26 +4,25 @@
4
4
 
5
5
  #### チェックボックスで選択された条件を元に、画像を出し分けたい
6
6
  例)
7
- sample1を選択したらimg1を表示する(img2,img3は非表示)
7
+ fishを選択したらimg1を表示する(img2,img3は非表示)
8
- sample2を選択したらimg2を表示する(img1,img3は非表示)
8
+ fruitsを選択したらimg2を表示する(img1,img3は非表示)
9
- sample1,sample2を選択したらimg3を表示する(img1,img2は非表示)
9
+ fish,fruitsを選択したらimg3を表示する(img1,img2は非表示)
10
+
11
+ fishとfruitsが選択されている場合にのみ
12
+ img3が表示されるようにしたいです。
10
13
 
11
14
  ```HTML
12
- <ul class="info_list">
13
- <li>
15
+ <ul>
14
- <input id="sample1" name="" value="sample1" type="checkbox">
16
+ <li><label><input id="fish" type="checkbox">まぐろ</label></li>
15
- <label for="sample1">これは条件です①</label>
16
- </li>
17
- <li>
18
- <input id="sample2" name="" value="sample2" type="checkbox">
17
+ <li><label><input id="fish" type="checkbox">サーモン</label></li>
19
- <label for="sample2">これは条件です②</label>
18
+ <li><label><input id="fruits" type="checkbox">りんご</label></li>
20
- </li>
19
+ <li><label><input id="fruits" type="checkbox">なし</label></li>
21
20
  </ul>
22
21
 
23
22
  <div class="img_list">
24
- <img class="info1" href="/img1">
23
+ <img class="fish" href="/img1"/>
25
- <img class="info2" href="img2"/>
26
- <img class="info1 info2" href="/img3"/>
24
+ <img class="fruits" href="/img2"/>
25
+ <img class="fruits_and_fish" href="/img3"/>
27
26
  </div>
28
27
  ```
29
28
  ```JavaScript

1

タイプミス修正

2022/05/31 02:37

投稿

shin12t
shin12t

スコア25

test CHANGED
File without changes
test CHANGED
@@ -51,7 +51,7 @@
51
51
  }
52
52
  }
53
53
  if (hasCount > 0) { //チェックされたもの1つでも持っていれば表示
54
- $(img_list[i]).css('dispkay', 'block');
54
+ $(img_list[i]).css('display', 'block');
55
55
  } else {
56
56
  $(img_list[i]).css('display', 'block');
57
57
  }