jQuery - 変更時にファイル入力をリセットする

Question

ユーザーが受け入れられないファイルを添付した場合、コンポーネントをクリアしようとしています。私はそれが添付された直後にそれをしようとしています。ここではいくつかの例を見てみましたが、その中のいくつかは、リセットボタンで行う方法、フォーム全体をリセットする方法、またはコンポーネントをクローンする方法を示していました。それは動作していません）。誰かが私を助けることができたら嬉しいです。前もって感謝します。

$("#mycomponent").on("change", function() 
{ 
    var extension = $(this).val().split(".").pop().toString(); 

    if((extension === "pdf") || (extension === "docx") || (extension === "doc")) 
    { 
     alert("OK");  
    } 
    else 
    { 
     alert("File extension not accepted"); 

     var mycomponent = $("#mycomponent"); 
     mycomponent.replaceWith(mycomponent = mycomponent.clone(true)); 
    } 
}); 

Answer 1

Working fiddle：ここ

は、私が持っているものの一例です。次の方法のようなwrap()/unwrap()の機能が動作するはず使用

：

$(this).wrap('<form>').closest('form').get(0).reset(); 
$(this).unwrap(); 

・ホープ、このことができます。あなたはヴァル（とコンポーネントをクリアすることができ

$("#mycomponent").on("change", function(){ 
 
    var extension = $(this).val().split(".").pop().toString(); 
 

 
    if((extension === "pdf") || (extension === "docx") || (extension === "doc")) 
 
    { 
 
    console.log("OK");  
 
    } 
 
    else 
 
    { 
 
    console.log("File extension not accepted"); 
 
    
 
    $(this).wrap('<form>').closest('form').get(0).reset(); 
 
    $(this).unwrap(); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="file" id="mycomponent" />

Answer 2

）、次のように：

$("#mycomponent").on("change", function() 
{ 
    var extension = $(this).val().split(".").pop().toString(); 

    if((extension === "pdf") || (extension === "docx") || (extension === "doc")) 
    { 
     alert("OK");  
    } 
    else 
    { 
     alert("File extension not accepted"); 

     var mycomponent = $("#mycomponent"); 
     mycomponent.val(""); 
    } 
});