有可能知道文件輸入對話框何時關閉？

Question

我有一個輸入文件選擇器，我想知道何時模式正在關閉，如果沒有選擇一個文件。我只知道當選擇一個文件，該文件只適用或改變

<input type="file" id="selector"> 
$("#selector").on("change", function() { 
    //Changed 
}); 

Answer 1

當打開的對話框中試試這個

<input type='file' id='testfile' style='display:none' /> 
    <button onclick='document.getElementById("testfile").click()'>Upload</button> 

<script> 
var testfile = document.getElementById('testfile') 

testfile.onclick = focus(); 

function focus() 
{ 
    document.body.onfocus = invoke(); 

} 

function invoke() 
{ 
    if(testfile.value.length) 
    { 
    alert('has file'); 
    } 
    else {alert('empty')} 
</script> 

Answer 2

的變化，它變得專注，所以瀏覽器窗口失去焦點。關閉對話框後，焦點將恢復。您必須在window上訂閱focus事件，但由於許多原因，窗口可能會丟失並獲得焦點，所以如果對話框已打開，則必須保留一個標記。

下面的代碼工作在：

• 的Chrome 63.0.3239.84 64位的Windows 7
• 的Internet Explorer 11.0.9600.18860在Windows 7
• 歌劇12.18 1872年的32倍在Windows 7

並且不起作用：

• 火狐58.0b11（64位）在Windows 7

function now() { 
 
    return window.performance ? performance.now() : +new Date 
 
} 
 

 
var isFileDialogOpened = false; 
 

 
var input = document.querySelector('input'); 
 

 
input.addEventListener('click', function (e) { 
 
    console.log('clicked', now()) 
 
    isFileDialogOpened = true 
 
}) 
 

 
input.addEventListener('blur', function (e) { 
 
    console.log('input blur', now()) 
 
    isFileDialogOpened = true 
 
}) 
 

 
window.addEventListener('focus', function (e) { 
 
    if (isFileDialogOpened) { 
 
    console.log('closed (window got focus)', now()) 
 
    isFileDialogOpened = false 
 
    } 
 
})

<input type=file>