ファイル入力をクリアする方法

以下は、ファイル入力と[ファイルのクリア]ボタンを表示するjqueryコードの一部です。

var $imagefile = $('<input />').attr({
    type: 'file',
    name: 'imageFile',
    class: 'imageFile'
});

$image.append($imagefile);

var $imageclear = $('<input />').attr({
    type: 'button',
    name: 'imageClear',
    class: 'imageClear',
    value: 'Clear File'
});

$image.append($imageclear);

「ファイルをクリア」ボタンがある理由は、ボタンをクリックすると、ファイル入力にあるものがすべてクリアされるためです。「ファイルのクリア」ボタンをクリックしたときに実際にファイル入力をクリアするようにコーディングするにはどうすればよいですか？

これは機能するはずです：

$imageClear.on('click', function() { 
    $imageFile.val(''); 
});

jQueryでファイル入力をクリアする

$("#fileInputId").val(null);

JavaScriptでファイル入力をクリア

document.getElementById("fileInputId").value = null;

これも私が使用したいメソッドですが、イベントを新しいオブジェクトにアタッチしたままにするには、bool trueパラメーターをcloneメソッドに追加する必要があり、コンテンツをクリアする必要があると思います。

    var input = $("#fileInput");

    function clearInput() {
        input = input.val('').clone(true);
    };

https://api.jquery.com/clone/

設定することで$("ID").val(null)、私のために働いた

Reactユーザー向け

e.target.value = ""

しかし、ファイル入力要素が（htmlFor属性を持つ）別の要素によってトリガーされた場合-それはあなたがイベントを持っていないことを意味します

したがって、次の参照を使用できます。

funcの開始時：

const inputRef = React.useRef();

入力要素上

<input type="file" ref={inputRef} />

次に、onClick関数（たとえば）でuは次のように記述できます。

inputRef.current.value = "" 

• Reactクラスで-同じ考えですが、コンストラクターが異なります： this.inputRef = React.createRef()

これがクロスブラウザ対応であることを確認したい場合の別の解決策は、タグをremove（）してから、append（）またはprepend（）するか、他の方法で同じ属性を持つ入力タグの新しいインスタンスを再度追加することです。 。

<form method="POST" enctype="multipart/form-data">
<label for="fileinput">
 <input type="file" name="fileinput" id="fileinput" />
</label>
</form>

$("#fileinput").remove();
$("<input>")
  .attr({
    type: 'file',
    id: 'fileinput',
    name: 'fileinput'
    })
  .appendTo($("label[for='fileinput']"));

これは

 $("#yourINPUTfile").val("");

私はこのようなことをしました、そしてそれは私のために働いています

$('#fileInput').val(null); 

私の場合、他の解決策はこの方法以外では機能しませんでした：

$('.bootstrap-filestyle :input').val('');

ただし、ページに複数のファイル入力がある場合は、それらすべてのテキストがリセットされます。

入力IDを取得し、次のようにvalを入力します。注：valの間にスペースを入れないでください。空の二重引用符val（ ""）。

 $('#imageFileId').val("")

このコードは、すべてのブラウザとすべての入力で機能します。

$('#your_target_input').attr('value', '');