input type="file" のボタンをオリジナルのボタンにする。 - Qiita

概要 Bootstrapを使うとボタン類は綺麗に装飾されますが、ファイル選択のボタンってCSSでは装飾出来ません。 そこでjqueryを使えば擬似的に好きな画像やbutton要素をファイル選択ボタン代わりに使うことが出来るようになります。 なお、jqueryを使用しているのでjqueryは読み込んでいる前提です。 ソース <input type="file" id="file" style="display:none;" onchange="$('#fake_input_file').val($(this).val())"> <input type="button" value="ファイル選択" onClick="$('#file').click();"> <input id="fake_input_file" readonly type="text" value="" onClick="

[kasumani]

input type=&quot;file&quot; のボタンをオリジナルのボタンにする。 Bootstrapを使うとボタン類は綺麗に装飾されますが、ファイル選択のボタンってCSSでは装飾出来ません。 そこでjqueryを使えば擬似的に好きな画像やbutton要素をファ