Preview upload
Hejsa.Jeg har et lille script som gør at man kan preview de billeder man vil uploaded INDEN de bliver uploaded (trykker submit).
<script type="text/javascript">
<!-- Begin
/***** CUSTOMIZE THESE VARIABLES *****/
// width to resize large images to
var maxWidth=122;
// height to resize large images to
var maxHeight=125;
// valid file types
var fileTypes=["bmp","gif","png","jpg","jpeg"];
// the id of the preview image tag
var outImage="previewField";
// what to display when the image is not valid
var defaultPic="spacer.gif";
/***** DO NOT EDIT BELOW *****/
function preview(what){
var source=what.value;
var ext=source.substring(source.lastIndexOf(".")+1,source.length).toLowerCase();
for (var i=0; i<fileTypes.length; i++) if (fileTypes[i]==ext) break;
globalPic=new Image();
if (i<fileTypes.length) globalPic.src=source;
else {
globalPic.src=defaultPic;
alert("THAT IS NOT A VALID IMAGE\nPlease load an image with an extention of one of the following:\n\n"+fileTypes.join(", "));
}
setTimeout("applyChanges()",200);
}
var globalPic;
function applyChanges(){
var field=document.getElementById(outImage);
var x=parseInt(globalPic.width);
var y=parseInt(globalPic.height);
if (x>maxWidth) {
y*=maxWidth/x;
x=maxWidth;
}
if (y>maxHeight) {
x*=maxHeight/y;
y=maxHeight;
}
field.style.display=(x<1 || y<1)?"none":"";
field.src=globalPic.src;
field.width=x;
field.height=y;
}
// End -->
</script>
Kaldes med:
<img alt="Graphic will preview here" id="previewField" src="spacer.gif">
Den virker også meget fint. Mit spørgsmål handler så om der er nogle der kan hjælpe mig med følgende:
Ovenstående script kan man kun vises 1 billede af gangen.
Men hvad nu hvis jeg har 9 input felter til fil upload og jeg gerne vil give brugeren den service at vise ham alle de billeder han har valgt til upload INDEN han trykker på submit.
Hvordan kan ovenstående script udvides sådan at den kan vise 9 billeder på een gang kaldet med 9 <img> tags ?
