[解決済み] <input type="file"> に画像ファイルしか受け付けないようにするには？

質問

画像ファイルのみを <input type="file"> タグを使用します。

現在、すべての種類のファイルを受け入れています。しかし、私は特定の画像ファイル拡張子のみに制限したいのです。 .jpg , .gif などです。

どうすればこの機能を実現できますか？

どのように解決するのですか？

を使用します。 受け入れる 属性で指定します。PNG、JPEG、GIFのみを受け入れるには、以下のコードを使用します。

<input type="file" name="myImage" accept="image/png, image/gif, image/jpeg" />

あるいは単純に

<input type="file" name="myImage" accept="image/*" />

これは、ユーザーに表示するファイルタイプのヒントをブラウザに提供するだけで、簡単に回避できることに注意してください。

IE 10+、Chrome、Firefox、Safari 6+、Opera 15+で動作するはずですが、モバイルでのサポートは非常に大雑把で（2015年現在）、いくつかの報告によると、実際には一部のモバイルブラウザで何もアップロードできない場合があるそうなので、ターゲットプラットフォームをよくテストする必要があります。

詳しい対応ブラウザは http://caniuse.com/#feat=input-file-accept