Vérifiez le fichier d’entrée pour le format correct avec jQuery

J’utilise ce code http://jsbin.com/uboqu3/83/edit#source

function readURL(input) { if (input.files && input.files[0]) { var reader = new FileReader(); reader.onload = function (e) { $('#blah') .attr('src', e.target.result) .width(180); }; reader.readAsDataURL(input.files[0]); } }

J’ai besoin de vérifier avec jQuery pour le format correct. Par exemple, si les images ont un format jpg, tout est ok et la fonction affiche une image qui sera chargée. Si les images -> gif, png affichent un message d’alerte ou un message div, le type d’entrée = le fichier sera réinitialisé et aucune image ne sera affichée. Quelqu’un peut-il me couper le souffle

Vous pouvez simplement vérifier que le nom du fichier a une extension différente de jpg:

 function readURL(input) { if (input.files && input.files[0]) { //Check the extension if(!(/\.jpe?g$/i).test(input.files[0].name)) return alert('Error'); var reader = new FileReader(); reader.onload = function (e) { $('#blah') .attr('src', e.target.result) .width(180); }; reader.readAsDataURL(input.files[0]); } }

Essaye ça

 function readURL(input) { if (input.files && input.files[0]) { var fileName = input.files[0]; if(fileName.toLowerCase().indexOf(".jpg") == -1){ alert("Invalid image file"); return; } var reader = new FileReader(); reader.onload = function (e) { $('#blah') .attr('src', e.target.result) .width(180); }; reader.readAsDataURL(input.files[0]); } }

Une approche plus fiable consiste à vérifier le type de fichier. C’est à dire:

 function readURL(input) { if (input.files && input.files[0]) { var fileName = input.files[0]; if(fileName.type != "image/jpeg"){ alert("Invalid image file"); return; } var reader = new FileReader(); reader.onload = function (e) { $('#blah') .attr('src', e.target.result) .width(180); }; reader.readAsDataURL(input.files[0]); } }