I'm setting up a website for a school, and I'm adopting a new feature. I created an input file for people to insert images and they, through a preview should appear in the respective pictures below. But it only works with the first frame! does not fall on the other three.
This is the link that you can see and understand: link
My code looks like this:
JavaScript:
<script type="text/javascript">
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#blah')
.attr('src', e.target.result)
};
reader.readAsDataURL(input.files[0]);
}
}
</script>
HTML:
<input type='file' onchange="readURL(this);" /> <img id="blah" class="largura" />
How do I make the image appear more often in other frames?