web-dev-qa-db-ja.com

JavaScript：画像の寸法を取得する

画像のURLしかありません。 JavaScriptのみを使用して、この画像の高さと幅を決定する必要があります。ページ上でユーザーに画像を表示することはできません。寸法を取得するにはどうすればよいですか？

javascripthtmlimage
80
JQueeeer
var img = new Image();

img.onload = function(){
  var height = img.height;
  var width = img.width;

  // code here to use the dimensions
}

img.src = url;
177
Shumii

新しいImageを作成します

var img = new Image();

srcを設定します

img.src = your_src

widthとheightを取得します

//img.width
//img.height
40
nc3b

これは関数を使用し、完了するまで待機します。

http://jsfiddle.net/SN2t6/118/

function getMeta(url){
    var r = $.Deferred();

  $('<img/>').attr('src', url).load(function(){
     var s = {w:this.width, h:this.height};
     r.resolve(s)
  });
  return r;
}

getMeta("http://www.google.hr/images/srpr/logo3w.png").done(function(test){
    alert(test.w + ' ' + test.h);
});
8
DavidDunham

ここでJQueryを使用して同様の質問と回答があります。

RLからリモート画像の幅と高さを取得

function getMeta(url){
  $("<img/>").attr("src", url).load(function(){
     s = {w:this.width, h:this.height};
     alert(s.w+' '+s.h);      
  }); 
}

getMeta("http://page.com/img.jpg");
0
Luke Knepper