teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

4

追記

2019/09/29 11:08

投稿

ringoame49
ringoame49

スコア46

title CHANGED
File without changes
body CHANGED
@@ -32,8 +32,33 @@
32
32
  var fileCapa = img.size; //これはダメでした
33
33
  $("#file_type").text(fileType);
34
34
  $("#file_capa").text(fileCapa);
35
-
36
- return false;
35
+ return false;
36
+
37
+ function filesize(url) {
38
+ var req = this.window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
39
+ if (!req) {
40
+ throw new Error('XMLHttpRequest not supported');
41
+ }
42
+
43
+ req.open('HEAD', url, false);
44
+ req.send(null);
45
+
46
+ if (!req.getResponseHeader) {
47
+ try {
48
+ throw new Error('No getResponseHeader!');
49
+ } catch (e) {
50
+ return false;
51
+ }
52
+ } else if (!req.getResponseHeader('Content-Length')) {
53
+ try {
54
+ throw new Error('No Content-Length!');
55
+ } catch (e2) {
56
+ return false;
57
+ }
58
+ } else {
59
+ return req.getResponseHeader('Content-Length');
60
+ }
61
+ }
37
62
  });
38
63
  ```
39
64
 
@@ -54,6 +79,7 @@
54
79
  var fileSrc= $this_children.attr('src');
55
80
  var fileCapa = filesize(fileSrc);
56
81
  $("#file_capa").text(fileCapa);
82
+ とした場合、画面にはfalse、
57
- とした場合、下記のようにエラーが出ます。
83
+ エラーは下記の内容が出ます。
58
84
 
59
85
  [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check

3

不要文字の削除

2019/09/29 11:08

投稿

ringoame49
ringoame49

スコア46

title CHANGED
File without changes
body CHANGED
@@ -56,4 +56,4 @@
56
56
  $("#file_capa").text(fileCapa);
57
57
  とした場合、下記のようにエラーが出ます。
58
58
 
59
- file-list.php:233 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check
59
+ [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check

2

追記

2019/09/29 11:01

投稿

ringoame49
ringoame49

スコア46

title CHANGED
File without changes
body CHANGED
@@ -41,4 +41,19 @@
41
41
 
42
42
  参考先サイト等でも教えていただけましと助かります。
43
43
 
44
- よろしくお願いいたします。
44
+ よろしくお願いいたします。
45
+
46
+
47
+ 追記
48
+
49
+ 製作者が自作したメソッドは記述しております。
50
+
51
+ そして
52
+ filesize(img);
53
+
54
+ var fileSrc= $this_children.attr('src');
55
+ var fileCapa = filesize(fileSrc);
56
+ $("#file_capa").text(fileCapa);
57
+ とした場合、下記のようにエラーが出ます。
58
+
59
+ file-list.php:233 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check

1

なぜか記述途中のがアップされた。

2019/09/29 11:00

投稿

ringoame49
ringoame49

スコア46

title CHANGED
File without changes
body CHANGED
@@ -1,15 +1,15 @@
1
1
  質問失礼します。
2
2
 
3
3
  タイトル通りですがどうしても方法がわかりません。
4
- どの様に記述すればクリックした画像のサイズ(バイト)とタイプ(jpgやpng等)を取得できるのでしょうか?
4
+ どの様に記述すればクリックした画像のサイズ(バイト)とタイプ(jpgやpng等)を取得できるのでしょうか?
5
5
  現在はこのように記述しております。
6
6
 
7
7
  HTML
8
8
  ```
9
- <div class="file"><a href="#"><img class="<?=$file['fileName']?>" src="images/sample.jpg"></a></div>
9
+ <div class="file"><a href="#"><img src="images/sample.jpg"></a></div>
10
10
  <dl>
11
11
  dt>ファイル容量: </dt>
12
- <dd id="file_capacity"></dd>
12
+ <dd id="file_capa"></dd>
13
13
  <dt>ファイルタイプ: </dt>
14
14
  <dd id="file_type"></dd>
15
15
  <dt>サイズ: </dt>
@@ -22,14 +22,23 @@
22
22
  $(".file a").on('click', function(){
23
23
  var $this_children = $(this).children('img');
24
24
 
25
- var src = $this_children.attr('src');
26
-
27
25
  var img = new Image();
28
26
  img.src = $this_children.attr('src');
29
- var nw = img.width; //画像サイズを取得
27
+ var nw = img.width;
30
28
  var nh = img.height;
31
29
  $("#file_size").text(nw + '×' + nh + 'px');
30
+
31
+ var fileType = img.type; //これはダメでした
32
+ var fileCapa = img.size; //これはダメでした
33
+ $("#file_type").text(fileType);
34
+ $("#file_capa").text(fileCapa);
32
35
 
33
36
  return false;
34
37
  });
35
- ```
38
+ ```
39
+
40
+ 他にfilesize(img)等も試しましたがダメでした。
41
+
42
+ 参考先サイト等でも教えていただけましと助かります。
43
+
44
+ よろしくお願いいたします。