アップロード時に選択したファイルをクリア
ファイルを選択前の状態に戻す
jQuery
$(function() {
// アップロードするファイルを選択
$('input[type=file]').change(function() {
$('#clear').show();
});
// ユーザエージェント
var ua = navigator.userAgent;
// ファイル参照をクリア
$('#clear').click(function() {
$('input[type=file]').val('');
// IE バージョン判定 10以下
if (ua.match(/MSIE\s(7|8|9|10)\./i)) {
$('#userfile_item').html('<input type="file" name="userfile">');
}
$(this).hide();
});
});
<input type="file">に対してのval('')がIE10以下で動作しないので、html()で対応。
CSS
#clear {
display: none;
}
HTML
<form enctype="multipart/form-data" method="post">
<span id="userfile_item">
<input type="file" name="userfile">
</span>
<input type="button" id="clear" value="ファイルをクリアする">
</form>
サンプル
