2015-11-23 3 views
0

Вот сценарий js для обработки изображения jpeg с изменением размера на стороне клиента. Изменение размера обрабатывается, когда изображение загружается анонимной функцией обратного вызова, определенной в asynchronousimg.onload(). Функция обратного вызова проверяет ширину и высоту загруженного изображения и изменяет размер, если он слишком велик. Проблема с приведенным ниже кодом заключается в том, что функция обратного вызова не вызывается, когда изображение загружается img.src = _URL.createObjectURL(f).Функция обратного вызова, не вызываемая в js

$('#uploaded_file_file_for_upload').change(function(){ 
    var _URL = window.URL || window.webkitURL; 
    var img; 
    var max_width = 0; 
    var max_height = 0; 
    var max_size_mb; 
    var f = $(this)[0].files[0]; 
    if (f != null) { 
     max_width = $('#max_width').val(); 
     max_height = $('#max_height').val(); 
     max_size_mb = $('#max_size_mb').val(); 
     alert(max_width +', ' + max_height); 
     $('#file_name').val(f.name); 
     alert(f.name); 
     $('#file_size').val(f.size/1024); 
     $('#file_type').val(f.type); //image/jpeg 
     $('#file_extension').val(f.name.split('.').pop().toLowerCase()); 
     alert(f.type); 
     alert(f.name.split('.').pop().toLowerCase()); 
     if (f.type == 'image/jpeg') { 
     img = new Image(); 
     img.onload(function(){ 
      var w = this.width, h = this.height; 
      alert('hi-max' + max_width + ' -- ' + max_height); 
      alert('hi' + w + ' xx ' + h); 
      if (w > max_width || h > max_height) { 
      if (w > max_width){ 
       h = Math.ceil(h * max_width/w); 
       w = max_width; 
      } else { 
       w = Math.ceil(w * max_height/h); 
       h = max_height; 
      }; 
      alert('before resize, ' + w + ' ?? ' + h); 
      resize(this, w, h); 
      $('#remove').val('true');    
      }; 
     }); 

     img.src = _URL.createObjectURL(f); 
     }; 
    }; 

ответ

2

Вы должны установить функцию для onload собственности, а не вызывать функцию с функцией в качестве свойства:

img.onload = function() { 
    // TODO 
};