質問編集履歴
3
タグを追加
test
CHANGED
File without changes
|
test
CHANGED
File without changes
|
2
・わかりやすく内容を修正
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
[HTML・JavaScript] モーダルにlocalstorageの
|
1
|
+
修正版[HTML・JavaScript] モーダルにlocalstorageのデータを表示させたいです
|
test
CHANGED
@@ -6,41 +6,39 @@
|
|
6
6
|
|
7
7
|
|
8
8
|
|
9
|
-
ボタンを押して、モーダルが表示された際
|
9
|
+
ボタンを押して、モーダルが表示された際にlocalstorageで保存されているデータを表示させたいのですが、
|
10
10
|
|
11
|
-
(日付ごとに保存した内容)
|
12
|
-
|
13
|
-
|
11
|
+
モーダルを出した後に表示させる方法が理解できておりません。
|
14
12
|
|
15
13
|
|
16
14
|
|
17
15
|
### 試したこと
|
18
16
|
|
19
|
-
・モーダル
|
17
|
+
・HTMLにあるonclickでモーダルが開くようになっている為、そこにlocalstorageに保存されているデータを表示させようとしましたが、失敗しました。
|
20
18
|
|
21
19
|
|
22
20
|
|
23
21
|
```JavaScript
|
24
22
|
|
25
|
-
$(document).ready(function () {
|
26
23
|
|
27
|
-
let params = (new URL(document.location)).searchParams;
|
28
24
|
|
29
|
-
var target = document.getElementById("back-button");
|
30
25
|
|
31
|
-
var year = params.get('year');
|
32
26
|
|
33
|
-
|
27
|
+
function hideModal(id) {
|
34
28
|
|
35
|
-
var
|
29
|
+
var modal = document.getElementById(id);
|
36
30
|
|
37
|
-
|
31
|
+
modal.hide();
|
38
32
|
|
39
|
-
|
33
|
+
};
|
40
34
|
|
41
|
-
|
35
|
+
function showModal(id) {
|
42
36
|
|
37
|
+
var modal = document.getElementById(id);
|
38
|
+
|
43
|
-
|
39
|
+
modal.show();
|
40
|
+
|
41
|
+
//localstorageに保存されている内容
|
44
42
|
|
45
43
|
var diaryData = [];
|
46
44
|
|
@@ -86,64 +84,6 @@
|
|
86
84
|
|
87
85
|
$('.wrapper').html(html);
|
88
86
|
|
89
|
-
|
90
|
-
|
91
|
-
function onLoad() {
|
92
|
-
|
93
|
-
document.addEventListener("deviceready", onDeviceReady, false);
|
94
|
-
|
95
|
-
}
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
function onDeviceReady() {
|
100
|
-
|
101
|
-
let params = (new URL(document.location)).searchParams;
|
102
|
-
|
103
|
-
var year = params.get('year');
|
104
|
-
|
105
|
-
var mon = params.get('mon');
|
106
|
-
|
107
|
-
var thisId = params.get('id');
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
loadImage(year, mon, thisId);
|
112
|
-
|
113
|
-
}
|
114
|
-
|
115
|
-
$(document).on('tap', '.images .img-container img', function () {
|
116
|
-
|
117
|
-
var imgSrc = $(this).attr('src');
|
118
|
-
|
119
|
-
$('.modalImage').attr('src', imgSrc)
|
120
|
-
|
121
|
-
showModal('previewImage');
|
122
|
-
|
123
|
-
});
|
124
|
-
|
125
|
-
$(document).on('tap', '.modal__content', function () {
|
126
|
-
|
127
|
-
hideModal('previewImage');
|
128
|
-
|
129
|
-
});
|
130
|
-
|
131
|
-
var hideModal = function (id) {
|
132
|
-
|
133
|
-
var modal = document.getElementById(id);
|
134
|
-
|
135
|
-
modal.hide();
|
136
|
-
|
137
|
-
};
|
138
|
-
|
139
|
-
function showModal(id) {
|
140
|
-
|
141
|
-
var modal = document.getElementById(id);
|
142
|
-
|
143
|
-
modal.show();
|
144
|
-
|
145
|
-
savedata(); //前の画面でデータを入れている変数
|
146
|
-
|
147
87
|
}
|
148
88
|
|
149
89
|
|
1
詳細追加
test
CHANGED
File without changes
|
test
CHANGED
@@ -7,6 +7,8 @@
|
|
7
7
|
|
8
8
|
|
9
9
|
ボタンを押して、モーダルが表示された際、前の画面でlocalstorage保存した内容を出力させようとしています。
|
10
|
+
|
11
|
+
(日付ごとに保存した内容)
|
10
12
|
|
11
13
|
※現在、モーダルではなく、モーダルを開くボタンがある画面で読み込んでいる形です。
|
12
14
|
|