选择通过jquery获取多个图像的大小高度和宽度

时间:2017-03-24 07:19:55

标签: javascript jquery

我正在使用以下代码,我现在想要多个图像

var _URL = window.URL || window.webkitURL;
    $("#logo_img").change(function (e) {
    var file, img;
    if ((file = this.files[0])) {
        img = new Image();
        img.onload = function () {
            alert(this.width + " " + this.height);
        };
        img.src = _URL.createObjectURL(file);
     }
   });

这是HTML

<form action="ajax/product_images" id="uploadForm1" method="post" enctype="multipart/form-data"> 
    <input type="file" name="files[]" accept="image/*" multiple="multiple" id="logo_img" onchange='openFile(event)' onChange="validate(this.value)" />                    
    <input type="hidden" value="2" id="upload_id" name="upload_id" /> 
    <input type="submit" name="submit" id="save" class="btn btn-default" style="float:right;" value="Upload"/>
</form>

1 个答案:

答案 0 :(得分:0)

您可以使用for循环:

执行此操作

&#13;
&#13;
var _URL = window.URL || window.webkitURL;
$("#logo_img").change(function(e) {
  for(var i = 0; i < this.files.length; i++) {
    var file = this.files[i];
    var img = new Image();
    img.onload = function() {
      console.log(this.width + " " + this.height);
    };
    img.src = _URL.createObjectURL(file);
  }
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="ajax/product_images" id="uploadForm1" method="post" enctype="multipart/form-data">
  <input type="file" name="files[]" accept="image/*" multiple="multiple" id="logo_img" />
  <input type="hidden" value="2" id="upload_id" name="upload_id" />
  <input type="submit" name="submit" id="save" class="btn btn-default" style="float:right;" value="Upload" />
</form>
&#13;
&#13;
&#13;