programing

jQuery에서 입력 파일이 비어 있는지 확인하는 방법

magicmemo 2023. 8. 4. 22:59
반응형

jQuery에서 입력 파일이 비어 있는지 확인하는 방법

JS에 새로 왔습니다.
jQuery/JavaScript로 양식을 제출할 때 파일 입력 요소가 비어 있는지 확인하려고 합니다.저는 많은 해결책들을 겪었지만 저에게 효과가 있는 것은 아무것도 없습니다.나는 그것을 피하려고 노력하고 있습니다./c/fakepath(다른 옵션이 없는 경우)

<input type="file" name="videoFile" id="videoUploadFile" />

이것은 작동하지 않습니다.

var vidFile = $("#videoUploadFile").value;

파일 이름을 가져올 수 있는 유일한 방법은 다음을 사용하는 것입니다.

var vidFile = document.getElementById("videoUploadFile").files[0].name;

사용 가능한 파일이 없으면 코드에서 다음 오류가 발생합니다.

정의되지 않은 속성 이름을 읽을 수 없습니다.

배열이 설정되어 있지 않기 때문에 말이 됩니다. 하지만 이것으로 오류를 처리하는 방법을 알 수 없습니다.

파일 입력 요소를 올바르게 가져오는 방법videoUploadFile비어 있는지 확인하고 비어 있으면 오류 메시지를 던집니까?

입력 요소에 포함된 FileList 개체인 files 속성의 길이만 확인하면 됩니다.

if( document.getElementById("videoUploadFile").files.length == 0 ){
    console.log("no files selected");
}

다음은 jQuery 버전입니다.

if ($('#videoUploadFile').get(0).files.length === 0) {
    console.log("No files selected.");
}

파일 길이 속성을 사용하여 입력 파일이 비어 있는지 여부를 확인하려면,index다음과 같이 지정해야 합니다.

var vidFileLength = $("#videoUploadFile")[0].files.length;
if(vidFileLength === 0){
    alert("No file selected.");
}

파티에 늦었다는 것은 알지만 결국 사용하게 된 것을 추가해야겠다고 생각했습니다. 즉, 파일 업로드 입력에 not 연산자와 JQuery가 포함되어 있지 않은지 확인하는 것입니다.

if (!$('#videoUploadFile').val()) {
  alert('Please Upload File');
}

양식에 포함된 경우 양식이 제출되지 않도록 다음 처리기로 래핑할 수도 있습니다.

$(document).on("click", ":submit", function (e) {

  if (!$('#videoUploadFile').val()) {
  e.preventDefault();
  alert('Please Upload File');
  }

}

질문:.파일 필드가 비어 있는지 확인하는 방법은 무엇입니까?

답변: 이 Jquery 코드를 사용하여 이 문제를 해결했습니다.

//If your file Is Empty:
if ($('#videoUploadFile').val() == '') {
    $('#message').html("Please Attach File");
} else {
    alert('ok');
}

    
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
    <input type="file" id="videoUploadFile">
</form>
<br>
<br>
<div id="message"></div>
  $("#customFile").change(function() { 
    var fileName = $("#customFile").val();  

    if(fileName) { // returns true if the string is not empty   
        $('.picture-selected').addClass('disable-inputs'); 
        $('#btn').removeClass('disabled');   
    } else { // no file was selected 
      $('.picture-selected').removeClass('disable-inputs'); 
      $('#btn').addClass('disabled');
    }  
  });
if (data.name == '') {
   //file doesn't exist;
}
else {
   //file exist;
}

언급URL : https://stackoverflow.com/questions/25793880/how-to-check-if-input-file-is-empty-in-jquery

반응형