☰

クリアリングjQueryを使用する 質問する

tag-icon • tag-icon javascript jquery html file-io forms
クリアリングjQueryを使用する 質問する

jQuery を使用してコントロール値をクリアすることは可能ですか<input type='file' />? 次のことを試しました:

$('#control').attr({ value: '' });

しかし、それは機能しません。

ベストアンサー1

簡単です。要素を で囲み<form>、フォームで reset を呼び出し、 を使用してフォームを削除します.unwrap()。.clone()このスレッドの他のソリューションとは異なり、最後には同じ要素 (設定されたカスタム プロパティを含む) が残ります。

Opera、Firefox、Safari、Chrome、IE6+ でテスト済みで動作します。 を除く他の種類のフォーム要素でも動作しますtype="hidden"。

window.reset = function(e) {
  e.wrap('<form>').closest('form').get(0).reset();
  e.unwrap();
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form>
  <input id="file" type="file">
  <br>
  <input id="text" type="text" value="Original">
</form>

<button onclick="reset($('#file'))">Reset file</button>
<button onclick="reset($('#text'))">Reset text</button>

JSFiddle

Timo が以下で述べているように、 内にフィールドのリセットをトリガーするボタンがある場合は、 が送信をトリガーするのを防ぐために イベントを<form>呼び出す必要があります。.preventDefault()<button>

編集

未修正のバグのため、IE 11 では動作しません。入力時にテキスト (ファイル名) はクリアされますが、Fileリストはそのまま残ります。

おすすめ記事