2012-04-12 92 views
5

我有一個使用文件API的html5應用程序,使用一個元素。我可以在用戶選擇文件時作出響應。如果用戶取消文件選擇,我希望能夠做些什麼。但是,如果用戶在文件選擇器對話框中單擊取消而不是確定按鈕,則無法在輸入元素上觸發事件。在輸入類型=文件上捕獲取消事件

在'取消'中是否發生了一些我不知道的事件,或者我應該重新構建我的應用程序而不需要這個?

回答

0

是不是真的有一個監聽器通過改變事件中使用像這樣在你的代碼中設置一個音符來檢查是否選擇了一個文件,你可以繞過它:

var FileChoosen = false; 

var inputElement = document.getElementById("inputField"); 
inputElement.addEventListener("change", handleFiles, false); 
function handleFiles() { 
    var fileList = this.files; /* now you can work with the file list */ 


    //Check if the layout was changed from file API: 
    if(document.getElementById('fileOutput').innerHTML != "") { 
    FileChoosen = true; 
    setTimeout("funcCalledToCheckUserSelection()", 500); 
    }; 


} 
3

當用戶點擊取消,再次更改事件觸發器。這對我很有用;

 $('#attachedFiles').bind("change", function() { 
      var file = this.files[0]; 
      if (file) { 
       // if file selected, do something 
      } else { 
       // if user clicks 'Cancel', do something 
      } 
     }); 
+5

哪些瀏覽器在文件輸入取消時引發更改事件?不適合我。 – 2015-04-07 13:28:14

+0

@E-D無法在Safari上工作 – 2015-11-02 11:20:34

+0

有關更多說明: 此命令僅適用於Google Chrome瀏覽器。 - **這是正常的** - 谷歌瀏覽器通過了政策,讓用戶選擇刪除文件,而不僅僅是取消-'browse ...' - 這是** policals瀏覽器的問題**其他只是必須取消點擊。文件輸入類型中的文件名顯示是一致的,具體取決於瀏覽器。在谷歌瀏覽器取消刪除輸入類型文件中的文件和文件名,而其他人什麼都不做。瞧。 – maliness 2016-09-27 16:07:54

0

我有同樣的問題,解決的辦法是令人驚訝的很容易......至少在我的情況NW.js(節點的Webkit),如果用戶點擊該文件選擇[取消]按鈕會oncancel事件對話。如果您也使用NW.js(process.version爲v5.11.0),則可以使用這種簡單而原生的方式。

我也試過Windows 10上的Microsoft HTA,它不會觸發oncancel事件。

相關問題