1. ホーム
  2. Web制作
  3. HTML/Xhtml

htmlフォームの「参照」ボタンをファイルアップロードに変更する方法

2022-01-16 19:47:04

コピーコード
コードは以下の通りです。

<!DOCTYPE HTML PUBLIC "-/W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title></title>
</head>
<body> <style>
input{border:1px solid #000;}
.clear{clear:both;}
.ehdel_upload_show input{float:left; margin-top:10px;}
.ehdel_upload{float:left;margin-top:-20px; *margin-top:-40px; filter:alpha(opacity=0);-moz-opacity:0;opacity:0;}
</style> <form method="post" action="" enctype="multipart/form-data">
<div class="ehdel_upload_show">
<input id="ehdel_upload_text" type="text" name="txt" />
<input id="ehdel_upload_btn" type="image" src="http://www.isclassic.net/wp-content/uploads/2010/07/link_ popup.gif" value="Please select file" />
</div>
<div class="clear"></div>
<input type="file" onchange="ehdel_upload_text.value=this.value" class="ehdel_upload" />
</form>
</body>
</html>