jQuery를 사용하여 <input type='file' /> 값을 지우는 방법

 

질문 : 청산 jQuery 사용

---

<input type='file' /> 제어 값을 지울 수 있습니까? 나는 다음을 시도했다 :

$('#control').attr({ value: '' }); 

하지만 작동하지 않습니다.

답변

---

쉬움 : <form> 을 감싸고 양식에서 reset을 호출 한 다음 .unwrap() 사용하여 양식을 제거합니다. .clone() 솔루션과 달리 끝에는 동일한 요소 (설정된 사용자 지정 속성 포함)가 있습니다.

Opera, Firefox, Safari, Chrome 및 IE6 +에서 테스트 및 작업했습니다. type="hidden" 제외하고 다른 유형의 양식 요소에서도 작동합니다.

window.reset = function(e) {
  e.wrap('<form>').closest('form').get(0).reset();
    e.unwrap();
    }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    
    <form>
      <input id="file" type="file">
        <br>
          <input id="text" type="text" value="Original">
          </form>
          
          <button onclick="reset($('#file'))">Reset file</button>
          <button onclick="reset($('#text'))">Reset text</button>

JSFiddle

<form> 내부에 필드 재설정을 트리거하는 버튼이있는 경우 이벤트에서 .preventDefault() 를 호출 <button> 이 제출을 트리거하지 않도록해야합니다.

수정되지 않은 버그로 인해 IE 11에서 작동하지 않습니다. 텍스트 (파일 이름)는 입력에서 지워지지 만 File 목록은 채워져 있습니다.

출처 : https://stackoverflow.com/questions/1043957/clearing-input-type-file-using-jquery