質問編集履歴

1

内容の詳細化

2018/06/18 00:08

投稿

kontasu
kontasu

スコア8

test CHANGED
File without changes
test CHANGED
@@ -16,6 +16,122 @@
16
16
 
17
17
  調べてはいるのですが、私の力不足により、方法が見いだせていません。
18
18
 
19
- Java script、お詳しい方、
20
19
 
20
+
21
+ 現在下記のコードのように、画像上にテクストボックスを挿入しています。
22
+
23
+ ```html
24
+
25
+ <div id="m1">
26
+
27
+ <img src="lib/woman.png">
28
+
29
+ <form id="t1" name="message1">
30
+
31
+ <textarea type="text1" name="namae" cols="18" rows="10">メッセージを書く</textarea>
32
+
33
+ </form>
34
+
35
+ ```
36
+
37
+
38
+
39
+ その後、Java scriptで入力した文字を保存しようと下記コードを入力しました。
40
+
41
+
42
+
43
+ ```JS
44
+
45
+ function btn1_click(){
46
+
47
+
48
+
49
+ var message1 = document.message1.namae.value;
50
+
51
+
52
+
53
+ localStorage.setItem('message1', message1);
54
+
55
+ localStorage.setItem('img1', "lib/woman.png");
56
+
57
+ ```
58
+
59
+
60
+
61
+ しかし、このままだと文字だけの保存になってしまい、画像と一緒に保存ができません。
62
+
63
+
64
+
65
+
66
+
67
+ ```HTML
68
+
69
+ <script>
70
+
71
+ ons.ready(function() {
72
+
73
+ console.log("Onsen UI is ready!");
74
+
75
+
76
+
77
+
78
+
79
+ tab.on('postchange', function(event) {
80
+
81
+ alert('aaa');
82
+
83
+ });
84
+
85
+
86
+
87
+ });
88
+
89
+
90
+
91
+ document.addEventListener('show', function(event) {
92
+
93
+ var page = event.target;
94
+
95
+ var titleElement = document.querySelector('#toolbar-title');
96
+
97
+
98
+
99
+ if (page.matches('#first-page')) {
100
+
101
+ titleElement.innerHTML = 'Capsule Gift';
102
+
103
+ } else if (page.matches('#second-page')) {
104
+
105
+ titleElement.innerHTML = 'Capsule Gift';
106
+
107
+
108
+
109
+ }
110
+
111
+ var message1 = localStorage.getItem('message1');
112
+
113
+ var img1 = localStorage.getItem('img1');
114
+
115
+
116
+
117
+ document.getElementById("message1").innerText = message1;
118
+
119
+
120
+
121
+ });
122
+
123
+ </script>
124
+
125
+ ```
126
+
127
+ 分の保存したいタブに画像とテキストを保存する方法を教えてください。
128
+
129
+ 言葉足らずですが、1つずつ学んでいきたいです。
130
+
131
+ この説明が足りないよ、こうしてみたら?など、
132
+
133
+ お力添えを頂けると嬉しいです。
134
+
135
+
136
+
21
- ぜひご協力をお願いします。
137
+ よろしくお願いいたします。