從「選擇文件」窗口中選擇一個文件並關閉它後，如何調用JavaScript函數？

Question

我有一個文件輸入元素

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

如何調用從對話框窗口中選擇一個文件，並關閉它後的JavaScript函數？

Answer 1

jQuery("input#fileid").change(function() { 
    alert(jQuery(this).val()) 
}); 

Answer 2

嘗試宣告你的文件的頂部：

<script type="text/javascript"> 
    // this allows jquery to be called along with scriptaculous and YUI without any conflicts 
    // the only difference is all jquery functions should be called with $jQ instead of $ 
    // e.g. $jQ('#div_id').stuff instead of $('#div_id').stuff 
    $jQ = jQuery.noConflict(); 
</script> 

則：

<script language="javascript"> 
$jQ(document).ready(function(){ 
    jQuery("input#fileid").change(function() { 
     alert(jQuery(this).val()); 
    }); 
}); 

（你可以把兩者在同一<script>標籤，但你可以例如，只需在你的父佈局中聲明第一部分，並在你的子佈局中使用jQuery時使用$ jQ，非常我們當與RoR工作時，例如）

正如在另一個答案中的評論中提到的，這將僅在選擇文件並單擊打開後觸發。如果您只需點擊「選擇文件」，並沒有任何選擇，它不會工作

Answer 3

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

當你把腳本輸入

<script type="text/javascript"> 
$(document).ready(function(){ 
    $("#fileid").on('change',function(){ 
     //do whatever you want 
    }); 
}); 
</script> 

Answer 4

<script> 
     function example(){ 
       alert('success'); 
     } 
</script> 


<input type="file" id="field" onchange="example()" > 

Answer 5

我覺得下面的變化將發揮你的目的是可以實現的，但是AFAIK沒有這樣的事件。

但是爲了達到那個你需要配合3個事件， 我假設你只需要知道文件名。 我創建轉轉here

1. 首先剛發射時實際變化發生，選擇相同的文件不會觸發更改事件這麼做打開對話框，並取消它的變化事件。
2. 然後點擊選擇文件，輸入元素將獲得焦點，當彈出文件對話框時打開輸入元素失去焦點。
3. 當彈出文件對話框關閉時，輸入元素將重新獲得焦點。
4. 因此，當輸入元素丟失時，您可能會在客戶端運行客戶端驗證。