fileセレクター
セレクター:fileは、
タイプfileの要素、つまりファイルアップロードフィールドを選択します。
$(':file')は
$('[type=file]')と同等です。
:fileはCSS仕様に含まれていないため、
モダンブラウザではパフォーマンス向上のために
[type='file']の使用が推奨されます。
構文
タイプfileの要素を選択する方法:
$(':file');
他の疑似クラスセレクター(':'で始まる)と同様に、
':'の前にはタグ名や他のセレクターを指定するのが良いでしょう。
指定しないと、'*'セレクターが適用されます。
つまり、$(':file')は
$('*:file')として解釈されるため、
$('input:file')を使用するのが望ましいです。
例
タイプfileのすべてのinput要素を選択し、
cssメソッドを使用して
緑色の背景と赤い枠線を設定してみましょう:
<form>
<input type="button" value="button">
<input type="file">
<input type="password">
<button>button</button>
<input type="reset">
<input type="radio" name="test">
<input type="radio" name="test">
<input type="checkbox">
<input type="text">
</form>
<+javascript+>
$('form input:file').css({background: 'green', border: '2px red solid'});
$('form').submit(function(event) {
event.preventDefault(); // フォームの送信を防止
});
<-javascript->