回答編集履歴

5

chousei

2023/04/21 08:09

投稿

yambejp
yambejp

スコア115201

test CHANGED
@@ -72,7 +72,7 @@
72
72
 
73
73
  window.addEventListener('DOMContentLoaded', ()=>{
74
74
  const ch=JSON.parse(localStorage.getItem('ch'));
75
- ch.forEach(x=>document.querySelector('output').appendChild(Object.assign(document.createElement('img',{src:url+imgs[x]}))));
75
+ ch.forEach(x=>document.querySelector('output').appendChild(Object.assign(document.createElement('img'),{src:url+imgs[x]})));
76
76
  });
77
77
  </script>
78
78
  <output></output>

4

調整

2023/04/21 07:07

投稿

yambejp
yambejp

スコア115201

test CHANGED
@@ -34,7 +34,12 @@
34
34
  1.html
35
35
  ```HTML
36
36
  <script>
37
+ const ce = new CustomEvent("HTMLEvents");
38
+ ce.initEvent('change', true, true );
39
+ window.addEventListener('pageshow', ()=>{
40
+ document.dispatchEvent(ce);
41
+ });
37
- document.addEventListener('change',({target})=>{
42
+ document.addEventListener('change',()=>{
38
43
  const ch=[...document.querySelectorAll('[name=ch]:checked')];
39
44
  localStorage.setItem('ch',JSON.stringify(ch.map(x=>x.value)));
40
45
  document.querySelectorAll('[name=ch]:not(:checked)').forEach(x=>x.disabled=ch.length>=2);
@@ -72,3 +77,4 @@
72
77
  </script>
73
78
  <output></output>
74
79
  ```
80
+ ※転機ミス修正+微調整

3

調整

2023/04/21 00:33

投稿

yambejp
yambejp

スコア115201

test CHANGED
@@ -29,3 +29,46 @@
29
29
  });
30
30
  </script>
31
31
  ```
32
+
33
+ # 画像版
34
+ 1.html
35
+ ```HTML
36
+ <script>
37
+ document.addEventListener('change',({target})=>{
38
+ const ch=[...document.querySelectorAll('[name=ch]:checked')];
39
+ localStorage.setItem('ch',JSON.stringify(ch.map(x=>x.value)));
40
+ document.querySelectorAll('[name=ch]:not(:checked)').forEach(x=>x.disabled=ch.length>=2);
41
+ });
42
+ </script>
43
+ <label><input type="checkbox" name="ch" value="0"><img src="https://placehold.jp/ff0000/0/100x100.png?text=1"></label>
44
+ <label><input type="checkbox" name="ch" value="1"><img src="https://placehold.jp/00ff00/0/100x100.png?text=2"></label>
45
+ <label><input type="checkbox" name="ch" value="2"><img src="https://placehold.jp/0000ff/0/100x100.png?text=3"></label>
46
+ <label><input type="checkbox" name="ch" value="3"><img src="https://placehold.jp/ffff00/0/100x100.png?text=4"></label>
47
+ <label><input type="checkbox" name="ch" value="4"><img src="https://placehold.jp/00ffff/0/100x100.png?text=5"></label>
48
+ <label><input type="checkbox" name="ch" value="5"><img src="https://placehold.jp/ff00ff/0/100x100.png?text=6"></label>
49
+ <label><input type="checkbox" name="ch" value="6"><img src="https://placehold.jp/ffffff/0/100x100.png?text=7"></label>
50
+ <label><input type="checkbox" name="ch" value="7"><img src="https://placehold.jp/000000/ffffff/100x100.png?text=8"></label><br>
51
+ <a href="2.html">2</a>
52
+ ```
53
+ 2.html
54
+ ```HTML
55
+ <script>
56
+ const url="https://placehold.jp/";
57
+ const imgs=[
58
+ "ff0000/0/100x100.png?text=1",
59
+ "00ff00/0/100x100.png?text=2",
60
+ "0000ff/0/100x100.png?text=3",
61
+ "ffff00/0/100x100.png?text=4",
62
+ "00ffff/0/100x100.png?text=5",
63
+ "ff00ff/0/100x100.png?text=6",
64
+ "ffffff/0/100x100.png?text=7",
65
+ "000000/ffffff/100x100.png?text=8",
66
+ ]
67
+
68
+ window.addEventListener('DOMContentLoaded', ()=>{
69
+ const ch=JSON.parse(localStorage.getItem('ch'));
70
+ ch.forEach(x=>document.querySelector('output').appendChild(Object.assign(document.createElement('img',{src:url+imgs[x]}))));
71
+ });
72
+ </script>
73
+ <output></output>
74
+ ```

2

調整

2023/04/20 08:10

投稿

yambejp
yambejp

スコア115201

test CHANGED
@@ -1,16 +1,31 @@
1
1
  一応localStorageはローカル環境でも有効のようです
2
-
2
+ 以下調整しました。
3
3
  1.html
4
4
  ```HTML
5
5
  <script>
6
+ document.addEventListener('change',({target})=>{
7
+ const ch=[...document.querySelectorAll('[name=ch]:checked')];
6
- localStorage.setItem('test',123);
8
+ localStorage.setItem('ch',JSON.stringify(ch.map(x=>x.value)));
9
+ document.querySelectorAll('[name=ch]:not(:checked)').forEach(x=>x.disabled=ch.length>=2);
10
+ });
7
11
  </script>
12
+ <label><input type="checkbox" name="ch" value="1">1</label><br>
13
+ <label><input type="checkbox" name="ch" value="2">2</label><br>
14
+ <label><input type="checkbox" name="ch" value="3">3</label><br>
15
+ <label><input type="checkbox" name="ch" value="4">4</label><br>
16
+ <label><input type="checkbox" name="ch" value="5">5</label><br>
17
+ <label><input type="checkbox" name="ch" value="6">6</label><br>
18
+ <label><input type="checkbox" name="ch" value="7">7</label><br>
19
+ <label><input type="checkbox" name="ch" value="8">8</label><br>
8
20
  <a href="2.html">2</a>
9
21
  ```
10
22
 
11
23
  2.html
12
24
  ```HTML
13
25
  <script>
26
+ window.addEventListener('DOMContentLoaded', ()=>{
14
- console.log(localStorage.getItem('test'));
27
+ const ch=JSON.parse(localStorage.getItem('ch'));
28
+ console.log(ch);
29
+ });
15
30
  </script>
16
31
  ```

1

調整

2023/04/20 06:43

投稿

yambejp
yambejp

スコア115201

test CHANGED
@@ -1,4 +1,4 @@
1
- localStorageる引き継ぎ
1
+ 一応localStorageはローカル環境でも有効のうです
2
2
 
3
3
  1.html
4
4
  ```HTML