[javascript] <입력 유형 =“파일”>을 재설정하는 방법

VS2012 및 Javascript로 메트로 앱을 개발 중입니다.

파일 입력 내용을 재설정하고 싶습니다 :

<input type="file" id="uploadCaptureInputFile" class="win-content colors" accept="image/*" />

어떻게해야합니까?



답변

주석에 @ dhaval-marthak이 게시 한 jQuery 솔루션은 분명히 작동하지만 실제 jQuery 호출을 보면 jQuery가 수행중인 작업을 쉽게 볼 수 value있습니다. 속성을 빈 문자열로 설정하면 됩니다. 따라서 “순수한”JavaScript에서는 다음과 같습니다.

document.getElementById("uploadCaptureInputFile").value = "";


답변

당신은 포장 필요 <input type = “file”><form>태그와 당신은 당신의 양식을 재설정하여 입력을 재설정 할 수 있습니다 :

onClick="this.form.reset()"


답변

이것이 가장 좋은 해결책입니다.

input.value = ''

if(!/safari/i.test(navigator.userAgent)){
  input.type = ''
  input.type = 'file'
}

여기에있는 모든 대답 중 가장 빠른 해결책입니다. 입력 복제본 없음, 양식 재설정 없음!

모든 브라우저에서 확인했습니다 (IE8도 지원합니다).


답변

다음과 같은 경우 :

<input type="file" id="fileControl">

그런 다음 그냥하십시오 :

$("#fileControl").val('');

파일 컨트롤을 재설정합니다.


답변

모든 이벤트가 여전히 첨부 된 상태에서 복제하여 자체로 교체 할 수 있습니다.

<input type="file" id="control">

var input = $("#control");

function something_happens() {
    input.replaceWith(input.val('').clone(true));
};

감사합니다 : Css-tricks.com


답변

다른 솔루션 (HTML DOM 요소를 선택하지 않고)

해당 입력에 ‘change’이벤트 리스너를 추가 한 경우 Javascript 코드에서 (일부 지정된 조건에 대해) 호출 할 수 있습니다.

event.target.value = '';

예를 들어 HTML에서 :

<input type="file" onChange="onChangeFunction(event)">

그리고 자바 스크립트에서 :

onChangeFunction(event) {
  let fileList = event.target.files;
  let file = fileList[0];
  let extension = file.name.match(/(?<=\.)\w+$/g)[0].toLowerCase(); // assuming that this file has any extension

  if (extension === 'jpg') {
    alert('Good file extension!');
  }
  else {
    event.target.value = '';
    alert('Wrong file extension! File input is cleared.');
  }


답변

해결책

다음 코드는 jQuery와 함께 작동했습니다. 모든 브라우저에서 작동하며 이벤트 및 사용자 정의 특성을 보존 할 수 있습니다.

var $el = $('#uploadCaptureInputFile');
$el.wrap('<form>').closest('form').get(0).reset();
$el.unwrap();

데모

코드 및 데모는 이 jsFiddle 을 참조하십시오 .

연결

자세한 내용 은 JavaScript파일 입력을 재설정하는 방법을 참조하십시오 .