ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery を使用してファイル入力コントロールの値をクリアするにはどうすればよいですか?

jQuery を使用してファイル入力コントロールの値をクリアするにはどうすればよいですか?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-12-13 03:01:16970ブラウズ

How Can I Clear a File Input Control's Value Using jQuery?

jQuery を使用したファイル入力コントロールのクリア

疑問が生じます。HTML ファイル入力コントロール (< input type="file") jQuery を使用しますか? attr({ value: '' }) によって要素の値を空の文字列に設定するという従来のアプローチは効果がないことがわかりました。

この問題に対処するために、独自の解決策が登場しました。ファイル入力コントロールは form 要素内にラップされます。その後、フォーム上でリセット メソッドが呼び出され、入力値が事実上クリアされます。最後に、unwrap() 関数を使用してフォームが削除されます。

重要なことに、この手法では元のファイル入力コントロールがそのまま残り、カスタム プロパティや属性が保持されます。テストでは、Opera、Firefox、Safari、Chrome、IE6 などのさまざまなブラウザとの互換性が確認されています。

さらに汎用性を高めるために、このアプローチは他のフォーム要素にも適用できます。ただし、非表示の入力フィールドは例外のままです。

以下は、このソリューションの実装方法を示すコード スニペットです:

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

<form>
  <input>

以上がjQuery を使用してファイル入力コントロールの値をクリアするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。