2013-09-19 3 views
7

вот мой сценарий. То, что я пытаюсь сделать, это запустить его, используя событие onchange. Но, похоже, не очень хорошо. Я пробовал редактировать здесь и там, но все еще сталкивался с проблемами. Что касается моих последних изменений ниже, проблема в том, что есть 2 файла, которые будут загружены, но только второй будет отображать предупреждающее сообщение, в то время как первый будет получать только любой файл.Применение javascript для проверки размера и расширения файла

<script> 
    function checkFile() 
    { 
    var node_list = document.getElementsByTagName('input'); 
    for (var i = 0; i < node_list.length; i++) 
    { 
     var node = node_list[i]; 
     if (node.getAttribute('type') == 'file') 
     { 
      var sFileName = node.value; 
      var sFileExtension = sFileName.split('.')[sFileName.split('.').length - 1]; 
      var iFileSize = node.files[0].size; 
      var iConvert=(node.files[0].size/10485760).toFixed(2); 
     } 


     if (sFileExtension != "pdf" && sFileExtension != "doc" && sFileExtension != "docx" && iFileSize>10485760) 
     { 
      txt="File type : "+ sFileExtension+"\n\n"; 
      txt+="Size: " + iConvert + " MB \n\n"; 
      txt+="Please make sure your file is in pdf or doc format and less than 10 MB.\n\n"; 
      alert(txt); 
     } 
    } 
} 
    </script> 

моя форма,

<input type="file" name="file" id="confirm" onchange="checkFile()"> 
    <input type="file" name="file" id="approveletter" onchange="checkFile()"> 

ответ

18

Вместо того, чтобы полагаться на элементы их самостоятельно, вы должны использовать данное событие для функции, чтобы получить файл (ы), которое инициировало вызов функции обратного вызова ,

Передача данных будет гарантировать, что вы фактически работаете с текущими файлами, которые вызвали функцию.

Например (я изменил имя переменной, чтобы сделать его более ясным):

ONLINE DEMO HERE

/// pass in event 
function checkFile(e) { 

    /// get list of files 
    var file_list = e.target.files; 

    /// go through the list of files 
    for (var i = 0, file; file = file_list[i]; i++) { 

     var sFileName = file.name; 
     var sFileExtension = sFileName.split('.')[sFileName.split('.').length - 1].toLowerCase(); 
     var iFileSize = file.size; 
     var iConvert = (file.size/1048576).toFixed(2); 

     /// OR together the accepted extensions and NOT it. Then OR the size cond. 
     /// It's easier to see this way, but just a suggestion - no requirement. 
     if (!(sFileExtension === "pdf" || 
       sFileExtension === "doc" || 
       sFileExtension === "docx") || iFileSize > 10485760) { /// 10 mb 
      txt = "File type : " + sFileExtension + "\n\n"; 
      txt += "Size: " + iConvert + " MB \n\n"; 
      txt += "Please make sure your file is in pdf or doc format and less than 10 MB.\n\n"; 
      alert(txt); 
     } 
    } 
} 
+0

Спасибо @Ken Я следил за изменениями, которые были предложены здесь выше, но он ничего не отвечает. Я также попробовал онлайн-демонстрацию, которую вы публикуете, ее работу! Я заметил, что вы положили getElementid над функцией. Я попробовал вставить его выше моей функции, все еще не работая. :(Помогите мне пожалуйста. – nanie

+0

@nanie, где вы помещаете прослушиватель событий, не имеет значения, как функции анализируются до того, как произойдет какое-либо исполнение.Получаете ли вы какие-либо сообщения об ошибках в консоли? (ctrl + i в Chrome, ctrl + k в FF) – K3N

+0

У меня нет сообщения об ошибке. Ничего не случилось. – nanie

0

http://jsfiddle.net/kVdT5/

взглянуть на эту скрипку. Он работает безотлагательно. как я сказал, что есть изменения в вашем состоянии if.

if (sFileExtension != "pdf" && sFileExtension != "doc" && sFileExtension != "docx" && iFileSize>10485760) 

заменить его с этим

if ((sFileExtension != "pdf" && sFileExtension != "doc" && sFileExtension != "docx") || iFileSize>10485760)) 
+0

Спасибо, но я не получить вам объяснения. Как я сказал ранее, он хорошо работает для второго файла, который я пытаюсь загрузить. Это дает мне ошибку, если файл другой, указанный или больший размер, и ничего не делать, если он находится в допустимом расширении и размере. Но действуйте по-другому в отношении первого файла. Я предполагаю, что проблема исходит из цикла, но я не знаю, как ее решить. – nanie

+0

Я думаю, что есть проблема с вашим оператором if. см. мой обновленный ответ – Patel

+0

Никакой другой @Patel .. Все тот же. Я пытаюсь загрузить тот же файл для обоих, но только второй отвечает на условие. – nanie

1

Это может помочь

var file = document.getElementById("filex").files[0]; 
var filename = file.name; 

var extSplit = filename.split('.'); 
var extReverse = extSplit.reverse(); 
var ext = extReverse[0]; 

if(!ext === "mp4" || !ext === "flv"){ 
    alert('Accepted'); 
} else { 
    alert('Not accepted'); 
} 
1

вы можете использоваться этот код файла контроллер в html. любой только передать параметр и увидеть выход

<script type="text/javascript"> 
function AlertFilesize(cid,sz,a){ 
    var controllerID = cid; 
    var fileSize = sz; 
    var extation = a; 
    if(window.ActiveXObject){ 
     var fso = new ActiveXObject("Scripting.FileSystemObject"); 
     var filepath = document.getElementById('fileInput').value; 
     var thefile = fso.getFile(filepath); 
     var sizeinbytes = thefile.size; 
    }else{ 
     var sizeinbytes = document.getElementById('fileInput').files[0].size; 
    } 
    var fSExt = new Array('Bytes', 'KB', 'MB', 'GB'); 
    fSize = sizeinbytes; i=0;while(fSize>900){fSize/=1024;i++;} 
    var fup = document.getElementById('fileInput'); 
    var fileName = fup.value; 
    var ext = fileName.substring(fileName.lastIndexOf('.') + 1); 
    if(ext == "gif" || ext == "GIF" || ext == "JPEG" || ext == "jpeg" || ext == "jpg" || ext == "JPG") 
    { 
     var fs = Math.round(fSize); 
     if(fs < fileSize && fSExt[i] == extation) 
     { 
      alert("Image Successfully Uploaded"); 
      return true;}else{ 
      alert("Please enter the image size less then"+fileSize+extation); 
      document.getElementById('fileInput').value=''; 
      return false; 
      } 
     }else{ 
     alert("Must be jpg and gif images ONLY"); 
     document.getElementById('fileInput').value=''; 
     return false;} 
    } 
</script> 
<input id="fileInput" type="file" onchange="AlertFilesize(this.id,100,'KB');" /> 
1
<script type="text/javascript"> 
function setFileSize() { 
     var fileEl = document.getElementById('<%=FileUpload1.ClientID%>'); 
     var fileSize = fileEl.files[0].size/1024/1024; 
     var fileName = fileEl.files[0].name; 
     var dotPosition = fileName.lastIndexOf("."); 
     var fileExt = fileName.substring(dotPosition); 
     if (fileSize > 1) { 
     fileEl.value = ''; 
      document.getElementById('<%=lblFileStatus.ClientID%>').innerHTML = 'File Should Be less Than 1MB'; 
      return false; 
     } 
} 


+0

также может добавить строку редактирования extraiion if (fileSize> 1 && fileExt! = ".png") {} –

0
<!DOCTYPE html> 
     <html> 
     <body> 

     <p>When you submit the form, a function is triggered which alerts some text.</p> 

     <form action="demo_form.asp" id="form"> 
      Enter name: <input type="file" name="fname" id="form_file" onchange=" return myFunction()"> 
      <input type="submit" value="Submit" id="submit"> 
     </form> 

     <script> 
     function myFunction() { 
      var file = document.getElementById("form_file"); 
      var file_name = file.value; 
      var extension = file_name.split('.').pop().toLowerCase(); 
      var size  = file.files[0].size; 
      var allowedFormats = ["jpeg", "jpg", "pdf", "tif"]; 

       if(!(allowedFormats.indexOf(extension) > -1)){ 
       alert("Enter a jpg/jpeg/pdf/tif file"); 

       document.getElementById("submit").disabled = true; 
       return false;    
       } else if(((size/1024)/1024) > 15){ 
       alert("Your file should be less than 15MB"); 
       return false; 
       } else { 
       document.getElementById("submit").disabled = false; 
       } 
     } 
     </script> 
     </body> 
     </html> 
Смежные вопросы