<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>画像変更</title>
<body>
<h2>画像選択</h2>
<label>画像
<input id="photo" type="file">
<label>
<label for="picture">画像</label>
<input id="photo1" accept=".jpeg , .png" type="file">
<h2>この画像を選びました</h2>
<img id="decide">
<script>
const picture = document.getElementById('photo1');
const picture1 = document.getElementById('decide');
picture.addEventListener('change', function (){
const file = picture.files[0];
if (file){
const load = new FileReader();
load.addEventListener('load', event =>{
picture1.src = event.target.result;;
});
load.readAsDataURL(file);
}
else{
alert("画像ファイルを指定してください。");
picture.value = '';
return false;
}
});
</script>
