函數返回的對象，但它返回未定義

我試圖讓圖像的寬度和從函數返回的高度，但每次得到的時間的返回不確定的，如果我在它顯示功能CONSOLE.LOG值，但它每次都返回undefined。函數返回的對象，但它返回未定義

主要問題，我懷疑是有範圍的，因爲它是一個嵌套函數，但我真的不知道，如果多數民衆贊成的情況下。

JS代碼

//get image width and height 
    $(document).ready(function(){ 
     //object method 
     function dimensions($width, $height){ 
     this.getWidth = $width; 
     this.getHeight = $height; 
     } 
     //gets image data 
     function readURL(input) { 
      var reader = new FileReader(); 
      var image = new Image(); 
      reader.onload = function (e) { 
      image.src = e.target.result; 
      } 
      reader.readAsDataURL(input.files[0]); 
      return image; 
     } 
     //gets image dimensions (width height) 
     function getImageDimensions($img){ 
     var $dimensions; 
      $img.onload = function(){ 
      $dimensions = new dimensions($img.width, $img.height); 
     } 
      return $dimensions; 
     } 

    $("#imgInp").change(function(){ 
    alert(getImageDimensions(readURL(this))); 
    }); 
    });

HTML代碼

<form id="form1" runat="server"> 
    <input type='file' id="imgInp" accept="image/*"/> 
    </form>

誰能向我解釋爲什麼它不返回一個對象，但是返回undefined？

來源

2017-04-02 mulvikciks

那是因爲你的圖像不具有寬度或高度，直到它在DOM渲染。所以，你有權把instanciation在onload處理。的事情是，處理器被觸發，只有當你的圖像加載，但在此之前你執行回線。換句話說，你這個功能

$img.onload = function(){ 
     $dimensions = new dimensions($img.width, $img.height); 
    }

前執行這條線

return $dimensions;

把這樣在$ img.onload返回：

$img.onload = function(){ 
     return new dimensions($img.width, $img.height); 
     }

來源

2017-04-02 18:48:53

如果我把警報在$ IMG。寬度和$ img.height getImageDimensions（$ img）函數圖像寬度和高度得到警報。 – mulvikciks

是的，我編輯我的回答 –

它仍然出於某種原因返回undefined。 – mulvikciks

函數返回的對象，但它返回未定義

回答

相關問題