画像のアップロードプレビュー
1674 ワード
<html>
<head>
<script type="text/javascript">
function preview() {
var x = document.getElementById("myfile");
d1.style.display = "block";
d2.style.display = "block";
var img1 = document.getElementById('img1');
var img2 = document.getElementById('img2');
img1.setAttribute('src', x.value);
img2.setAttribute('src', x.value);
img1.setAttribute('width', 120);
img1.setAttribute('height', 90);
img2.setAttribute('width', 300);
img2.setAttribute('height', 225);
}
</script>
</head>
<body>
<form method="post" action="#">
<input type="file" name="myfile" id="myfile" onchange="preview()" />
</form>
<div id="d1" style="display:none;">
<h4>120*90</h4>
<img src="" id="img1" />
</div>
<div id="d2" style="display:none;">
<h4>300*225</h4>
<img src="" id="img2" />
</div>
</body>
</html>