Jquery or ajax: upload and display five pictures selected

Fermé
ksomda Messages postés 36 Date d'inscription lundi 17 février 2014 Statut Membre Dernière intervention 2 septembre 2016 - 9 oct. 2014 à 16:32
Good evening everyone,
I am a beginner in programming with jquery ajax and. I want to realize an upload and display five photos without refresh the page.
now, what I have to do is load and display a single photo even if I select multiple images is the first that is still uploaded. selected.
here is my code:

<html>
<head>
<title>Upload five picture only</title>
<style>
#photo
{
width:100px;
height:100px;
}
</style>
<script src="js/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
/* The uploader form */
$(function ()
{
$(":file").change(function ()
{
if (this.files && this.files[0])
{
var reader = new FileReader();
reader.onload = imageIsLoaded;
reader.readAsDataURL(this.files[0]);
}
});
});

function imageIsLoaded(e)
{
$('#photo').attr('src', e.target.result);
};
</script>
</head>
<body>
<input type='file' name='photos[5]' multiple='true'/>
</br>
<img id="photo" src="#" alt="your picture" >
</body>
</html>