проверить расширение файла перед отправкой формы php

Question

Я пытаюсь выполнить немедленную проверку расширения файла перед его загрузкой и показать сообщение о том, что если расширение не разрешено (разрешено только PDF), то следующее: здесь добавлен скрипт на текущей странице PHP:

<script> 
    function checkExt() { 
     var form_valid = (document.getElementById('fileToUpload').value= "PDF"); 
     if(!form_valid) { 
      alert('only PDF are allowed'); 
      return false; 
     } 
     return true; 
    } 
</script> 

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

<form onsubmit='return checkExt()' action='AddPlan.php' method='POST' enctype='multipart/form-data' > 

    <input type='file' value="PDF" name='fileToUpload' id='fileToUpload' required> 

    <input type='submit' value='upload' name='submit' style="float:left" /> 
</form> 

Answer 1

<script> 
function checkExt(){ 
    var allowedFiles = [".pdf"]; 
    var form_valid = document.getElementById("fileToUpload"); 
    var regex = new RegExp("([a-zA-Z0-9\s_\\.\-:])+(" + allowedFiles.join('|') + ")$"); 
    if (!regex.test(form_valid.value.toLowerCase())) { 
     alert('only PDF are allowed'); 
     return false; 
    } 
    return true; 
} 
</script> 

Answer 2

Пожалуйста, попробуйте следующее:

<input type='file' value="PDF" name='fileToUpload' id='fileToUpload' required> 

В

<input type='file' value="PDF" name='fileToUpload' id='fileToUpload' accept="application/pdf" required> 

Javascript:

function checkExt(e){ 
    var fileName = document.getElementById('fileToUpload').value; 
    var ext = fileName.substring(fileName.lastIndexOf('.') + 1); 
    if(ext == "pdf" || ext == "PDF") { 
     return true; 
    }else{ 
     alert('only PDF are allowed'); 
     return false;      
    }  
} 

Это только показывает только файл PDF.

Answer 3

function checkExt(){ 
 
    var type = $('#fileToUpload')[0].files[0].type; 
 
    if ($.inArray(type, ['application/pdf']) == -1) { 
 
    return false; 
 
    } 
 
    return true; 
 
}

Answer 4

Вы можете попробовать использовать File API See MDN в сочетании с некоторыми основными испытаниями регулярными выражениями, как:

<script type='text/javascript'> 
    function checkExt(id){ 
     var fileslist = document.getElementById(id).files; 
     var valid=false; 
     var type,name,size; 
     var pttn_ext=/(\.pdf|\.PDF)/; 
     var pttn_mime=/application\/pdf/; 

     for(var i=0; i < fileslist.length; i++){ 
      type = fileslist[ i ].type; 
      name = fileslist[ i ].name; 
      size = fileslist[ i ].size; 

      if(pttn_ext.test(name) && pttn_mime.test(type)){ 
       valid=true; 
      } 
     } 
     if(!valid)alert('Only PDF files are allowed'); 
     return valid; 
    } 
</script> 



<form name='pdfonly' method='post' action='AddPlan.php' onsubmit='return checkExt("fileToUpload")' enctype='multipart/form-data'> 
    <h1>Only PDF File upload</h1> 
    <input type='file' value="PDF" name='fileToUpload' id='fileToUpload' required> 
    <input type='submit' value='submit' /> 
</form> 

Answer 5

Вы также можете попробовать это. theForm - это идентификатор вашей формы

function checkExt(){ 
    var extension = theForm.fileToUpload.value.substr(theForm.fileToUpload.value.lastIndexOf('.')); 
    if ((extension.toLowerCase() != ".pdf") && (extension != "")) 
     { 
     alert("Only PDF are allowed"); 
     theForm.FileUpload.focus(); 
     return false; 
     } 
     return true; 

    }