输入[类型文件]更改后，变量imageLen没有重置

Question

我有这段代码正在造成我的问题...。

  "use strict"; $(document).ready(function() { $(".mylbl").click(function() { var imageslen, imagesSize, imagesName; //decleartion variale //Intiallize variables for prevent to upload many time images imageslen = imagesSize = imagesName = 0; $(".inputfile").click(); $(".inputfile").change(function() { imageslen = 0; var uploadedImages = $(".inputfile")[0].files; imageslen = uploadedImages.length; imagesSize = []; imagesName = []; for (var i = 0; i < imageslen; i++) { imagesSize[i] = uploadedImages[i].size; imagesName[i] = uploadedImages[i].name; console.log(imagesSize[i]); console.log(imagesName[i]); } }); }); }); 

 body { margin: 0px; padding: 0px; background-color: #ccc; color: #f4f9c4; width: 100%; height: 100%; } form { box-sizing: border-box; border: 10px solid #fff; width: 250px; height: 300px; margin: auto; padding: 20px; } .mylbl { box-sizing: border-box; text-align: center; display: block; min-width: 80px; height: 50px; background-color: #ff4500; line-height: 300%; border: 5px solid #C33100; border-radius: 10px; cursor: pointer; } .inputfile { display: none; } .btn { width: 200px; height: 70px; background-color: #129EA4; border: none; border: 5px solid #fff; border-radius: 10px; margin: 10px 10px; cursor: pointer; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form class="myform" method="post" id="myform" enctype="multipart/form-data"> <input type="file" name="album" name="gallry[]" multiple class="inputfile" /> <label for="imgrs" class="mylbl">Please Choose Images..</label> <input id="_d11re" type="button" name="addimagedata" value="Upload" class="_p25ed btn" /> </form> 

在运行此代码之前，请打开浏览器的控制台..以检查问题并上传3个或4个以上的时间图像

问题出在js代码中，变量imageslen没有重置。.当我第一次上传图像时，代码工作正确，当我第二次单击该labal（“请选择图像”）以上传图像图像时，却两次。在这里，我向您展示我的Google chrome的小图。

Answer 1

每次单击mylbl都会将一个新的Change EventListener绑定到inputfile 。

$(".mylbl").click(function() {
    $(".inputfile").click();
    // move the rest of the function from HERE
}
// to HERE

如果您还有其他问题，请编写jsFiddle或其他内容以向我们展示您的中间结果。