Skip to content

Instantly share code, notes, and snippets.

@amrikarisma
Created August 22, 2022 03:59
Show Gist options
  • Save amrikarisma/96eb406bca39385bc42494009581ce8e to your computer and use it in GitHub Desktop.
Save amrikarisma/96eb406bca39385bc42494009581ce8e to your computer and use it in GitHub Desktop.
Preview image on input file before upload
<input type="file" accept="image/*" onchange="loadFile(event)">
<img id="output"/>
<script>
var loadFile = function(event) {
var output = document.getElementById('output');
output.src = URL.createObjectURL(event.target.files[0]);
output.onload = function() {
URL.revokeObjectURL(output.src) // free memory
}
};
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment