동일한 이름의 파일을 선택하면 자바 스크립트 파일 입력 onchange가 실행되지 않습니다.

Question

사용자가 이미지를 업로드 할 수 있도록 내 웹 페이지에 파일 입력이 있습니다.

이미지를 선택하면 파일 입력의 변경 이벤트가 트리거되고 이미지 미리보기가 표시되도록 설정했습니다.

가끔 미리보기가 나타나면 이미지를 조금씩 조정해야합니다 (예 : 페인트를 사용하여 자르기). 그런 다음 페인트에서 저장을 클릭하고 파일 입력을 클릭하고 파일을 다시 선택하십시오.

문제는 파일을 다시 선택하면 이미지 데이터가 변경 되어도 입력 이벤트가 발생하지 않으며 파일을 내 서버에 업로드하려고하면 이전 이미지 데이터가 사용된다는 것입니다.

파일 입력 변경 이벤트가 발생하지 않고 사용자가 실제로 파일을 선택할 때 감지 할 수있는 방법이 있습니까? 그렇다면이 사건을 잘 처리 할 수 ​​있습니까?

편집 : 사용자가 이미지를 선택하고 작동 할 때마다 파일 입력을 삭제하고 다시 만들 수는 있지만 파일 입력에 '파일을 선택하지 않음'이라고 표시되어 사용자를 혼란스럽게합니다.

Answer 1

간단한 솔루션은 다음을 수행하는 것입니다 : 파일 브라우징 팝업을 여는 초기 클릭 입력을 지 웁니다 때문에

this.input.addEventListener('click', function() { 
    this.value = ''; 
}, false); 

이는 변경 이벤트는 사용자가 파일을 선택 언제든지 트리거됩니다. 대신 .addEventListener()되지 않는의

Answer 2

this.input.bind('click', function() { 
    this.value = ''; 
}, false); 

그냥 그 값을 다시 설정해야 .bind()