回答編集履歴
3
追記
answer
CHANGED
@@ -26,6 +26,7 @@
|
|
26
26
|
```
|
27
27
|
追記
|
28
28
|
---
|
29
|
+
Image()を使うことでwidth, heightが取得できると思いますが。
|
29
30
|
```HTML
|
30
31
|
<!DOCTYPE html>
|
31
32
|
<html lang="ja">
|
@@ -40,13 +41,13 @@
|
|
40
41
|
<script>
|
41
42
|
$(document).ready(function () {
|
42
43
|
$("#fileUpload").on("change", function () {
|
43
|
-
|
44
|
+
let fileReader = new FileReader();
|
44
|
-
fileReader.onload = function (
|
45
|
+
fileReader.onload = function () {
|
45
46
|
let image = new Image();
|
46
|
-
image.src =
|
47
|
+
image.src = fileReader.result;//読み込まれたファイルの内容
|
47
48
|
image.onload = function () {
|
48
49
|
alert(image.width + " : " + image.height);
|
49
|
-
$('#uploadImage').attr("src",
|
50
|
+
$('#uploadImage').attr("src", image.src);//画像のURLをソースに設定
|
50
51
|
};
|
51
52
|
};
|
52
53
|
fileReader.readAsDataURL(this.files[0]);
|
2
追記
answer
CHANGED
@@ -13,7 +13,7 @@
|
|
13
13
|
<script>
|
14
14
|
$(document).ready(function () {
|
15
15
|
$("#fileUpload").on("change", function () {
|
16
|
-
|
16
|
+
let fileReader = new FileReader();
|
17
17
|
fileReader.onload = function (e) {
|
18
18
|
$('#uploadImage').attr('src', e.target.result);
|
19
19
|
};
|
1
追記
answer
CHANGED
@@ -23,4 +23,36 @@
|
|
23
23
|
</script>
|
24
24
|
</body>
|
25
25
|
</html>
|
26
|
+
```
|
27
|
+
追記
|
28
|
+
---
|
29
|
+
```HTML
|
30
|
+
<!DOCTYPE html>
|
31
|
+
<html lang="ja">
|
32
|
+
<head>
|
33
|
+
<meta charset="utf-8">
|
34
|
+
<title>タイトル</title>
|
35
|
+
</head>
|
36
|
+
<body>
|
37
|
+
<input type="file" id="fileUpload">
|
38
|
+
<img src="#" id="uploadImage" alt="アップロード">
|
39
|
+
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
|
40
|
+
<script>
|
41
|
+
$(document).ready(function () {
|
42
|
+
$("#fileUpload").on("change", function () {
|
43
|
+
var fileReader = new FileReader();
|
44
|
+
fileReader.onload = function (e) {
|
45
|
+
let image = new Image();
|
46
|
+
image.src = e.target.result;
|
47
|
+
image.onload = function () {
|
48
|
+
alert(image.width + " : " + image.height);
|
49
|
+
$('#uploadImage').attr("src", e.target.result);
|
50
|
+
};
|
51
|
+
};
|
52
|
+
fileReader.readAsDataURL(this.files[0]);
|
53
|
+
});
|
54
|
+
});
|
55
|
+
</script>
|
56
|
+
</body>
|
57
|
+
</html>
|
26
58
|
```
|