質問編集履歴

4

マークダウンのミス修正

2019/12/07 23:18

投稿

theplace
theplace

スコア24

test CHANGED
File without changes
test CHANGED
@@ -126,7 +126,7 @@
126
126
 
127
127
 
128
128
 
129
- ###追記
129
+ ##追記
130
130
 
131
131
  下記の通り修正したところ正常にできました。
132
132
 

3

微修正

2019/12/07 23:18

投稿

theplace
theplace

スコア24

test CHANGED
File without changes
test CHANGED
@@ -130,6 +130,8 @@
130
130
 
131
131
  下記の通り修正したところ正常にできました。
132
132
 
133
+ ご指定誠にありがとうございました。
134
+
133
135
  ```
134
136
 
135
137
  window.addEventListener('DOMContentLoaded', function () {

2

jsの修正内容を追記

2019/12/07 23:18

投稿

theplace
theplace

スコア24

test CHANGED
File without changes
test CHANGED
@@ -90,7 +90,7 @@
90
90
 
91
91
  ###追記
92
92
 
93
- すみません、もう一点教えていただきたいのですが、を用いて以下のように書き換えてもうまくいきません。
93
+ すみません、もう一点教えていただきたいのですが、`onload`プロパティを用いて以下のように書き換えてもうまくいきません。
94
94
 
95
95
  `reader.addEventListener('load', function () ・・・`を使うのと`onload`プロパティを用いるのとで何が異なるのでしょうか。
96
96
 
@@ -123,3 +123,37 @@
123
123
  });
124
124
 
125
125
  ```
126
+
127
+
128
+
129
+ ###追記
130
+
131
+ 下記の通り修正したところ正常にできました。
132
+
133
+ ```
134
+
135
+ window.addEventListener('DOMContentLoaded', function () {
136
+
137
+ document.getElementById('file').addEventListener('change', function (e) {
138
+
139
+ var input = document.getElementById('file').files[0];
140
+
141
+ var reader = new FileReader();
142
+
143
+ console.log('bbb');
144
+
145
+ reader.onload = function(){
146
+
147
+ document.getElementById('result').textContent = reader.result;
148
+
149
+ };
150
+
151
+ reader.readAsText(input, 'UTF-8');
152
+
153
+
154
+
155
+ }, true);
156
+
157
+ });
158
+
159
+ ```

1

別の書き換えパターンにしたときの不具合の原因について追記

2019/12/07 23:17

投稿

theplace
theplace

スコア24

test CHANGED
File without changes
test CHANGED
@@ -85,3 +85,41 @@
85
85
  そもそもFileReaderオブジェクトについて、テキストでもファイルの読み込みに必要と書かれてあるだけで、これが何なのかがよくわかりません。
86
86
 
87
87
  ファイルの読み込み処理は`reader.readAsText(input, 'UTF-8');`で行っているのではないでしょうか。
88
+
89
+
90
+
91
+ ###追記
92
+
93
+ すみません、もう一点教えていただきたいのですが、cを用いて以下のように書き換えてもうまくいきません。
94
+
95
+ `reader.addEventListener('load', function () ・・・`を使うのと`onload`プロパティを用いるのとで何が異なるのでしょうか。
96
+
97
+
98
+
99
+ ```
100
+
101
+ window.addEventListener('DOMContentLoaded', function () {
102
+
103
+ document.getElementById('file').addEventListener('change', function (e) {
104
+
105
+ var input = document.getElementById('file').files[0];
106
+
107
+ var reader = new FileReader();
108
+
109
+ console.log('bbb');
110
+
111
+ reader.onload = function(){
112
+
113
+ document.getElementById('result').textContent = reader.result;
114
+
115
+ reader.readAsText(input, 'UTF-8');
116
+
117
+ };
118
+
119
+
120
+
121
+ }, true);
122
+
123
+ });
124
+
125
+ ```