Как проверить ввод (тип = "файл") с помощью JavaScript только для загрузки изображений? - PullRequest
Новая
       34

Как проверить ввод (тип = "файл") с помощью JavaScript только для загрузки изображений?

0 голосов
/ 27 мая 2018

Мне нужен ввод только для загрузки изображений, я пытался использовать этот код, но я все еще могу некоторые файлы .exe, если я выбираю все файлы из окна загрузки, он просто выдает предупреждение, и я могу нажать ОК, затем файлвсе еще загружен, и я могу нажать отправить.

как удалить загруженный файл ?? 

function validateFileType(){
            var fileName = document.getElementById("fileName").value,
                idxDot = fileName.lastIndexOf(".") + 1,
                extFile = fileName.substr(idxDot, fileName.length).toLowerCase();
            if (extFile=="jpg" || extFile=="jpeg" || extFile=="png"){
                //TO DO
            }else{
                alert("Only jpg/jpeg and png files are allowed!");
            }
        }
<input name="image" type="file" id="fileName" accept=".jpg,.jpeg,.png" onchange="validateFileType()">

Ответы [ 2 ]

0 голосов
/ 27 мая 2018

Вам, вероятно, следует прочитать эту статью MDN , чтобы получить лучший опыт работы с файлами из input[type=file]

Отвечая на ваш вопрос, вы все равно можете input.value = ""

function validateFileType(input){
  var fileName = input.value,
      idxDot = fileName.lastIndexOf(".") + 1,
      extFile = fileName.substr(idxDot, fileName.length).toLowerCase();
  if (["jpg", "jpeg", "png"].includes(extFile)){
      //TO DO
  } else {
      alert("Only jpg/jpeg and png files are allowed!");
      input.value = ""
  }
}
<input name="image" type="file" id="fileName" accept=".jpg,.jpeg,.png" onchange="validateFileType(this)">
0 голосов
/ 27 мая 2018

Вам необходимо сбросить input в дополнение к предупреждению пользователя: 

let file = document.getElementById("fileName");
function validateFileType(){
  var fileName = file.value,
  idxDot = fileName.lastIndexOf(".") + 1,
  extFile = fileName.substr(idxDot, fileName.length).toLowerCase();
  if (extFile=="jpg" || extFile=="jpeg" || extFile=="png"){
    //TO DO
  }else{
    alert("Only jpg/jpeg and png files are allowed!");
    file.value = "";  // Reset the input so no files are uploaded
  }
}
<input name="image" type="file" id="fileName" accept=".jpg,.jpeg,.png" onchange="validateFileType()">
...