2017-06-20 4 views
0

入力タイプファイルhtml(アップロードファイル)の「キャンセル」または「閉じる」クリックイベントを検出することはできますか?

$('.this_add').click(function(){ 
 
\t $('.add_upload').append('<input type="file" name="file[]">'); 
 
\t $('input[type="file"]:last').click(); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<html> 
 
    <body> 
 
     <button class="this_add">add</button> 
 
     <form action="" method="POST" enctype="multipart/form-data"> 
 
     <input type="file" name="image[]" /> 
 
     <div class="add_upload"></div> 
 
     <input type="submit"/> 
 
     </form> 
 
     
 
    </body> 
 
</html>

私は上記のスニペットのようなシナリオを持っています。ユーザーが[追加]ボタンをクリックすると、入力タイプのファイルが<div class="add_upload>に追加され、クリックイベントがトリガーされます。ユーザーがcancel or closeをクリックすると、入力ファイルが削除されます。 enter image description here

jQueryまたはJavascriptを使用してHTMLの入力タイプファイルで「キャンセルまたは閉じる」のクリックイベントを確認できますか?

+0

[ファイル入力時にキャンセルがクリックされた場合の検出方法](https://stackoverflow.com/questions/4628544/how-to-detect-when-cancel-is-clicked-on-file-入力) – nem035

答えて

0
var file = document.getElementById('file') 

    file.onclick = charge 

    function charge() 
    { 
     document.body.onfocus = roar 
     console.log('chargin') 
    } 

    function roar() 
    { 
     if(file.value.length) alert('ROAR! FILES!') 
     else alert('*empty wheeze*') 
     document.body.onfocus = null 
     console.log('depleted') 
    } 


    $(input[type="submit"]).click(function(){ 
     document.getElementById("file").click() 
    }) 

希望します!

関連する問題