After clicking the browsing, you will automatically display the preview effect on the page. I tried it myself.
The key is to use the ONChange event of the File object and to determine the uploaded format.
DOCTYPE HTML PUBLIC "- // w3c // DTD XHTML 1.0 Transitional // En" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"
>
<
HTML
XMLNS
= "http://www.w3.org/1999/xhtml"
XML: LANG
= "en"
LANG
= "en"
>
<
HEAD
>
<
Title
>
Title
>
HEAD
>
<
Body
>
<
Script
Type
= "Text / JavaScript"
>
FUNCTION
PreviewPic () {img
=
Document.getlementByid (
"
fly
"
);
IF
(IMG) {Imgext
=
Img.value.substring (img.value.indexof ('.'), img.value.length; imgext
=
Imgext.tolowercase ();
IF
(Imgext
! =
'.bmp'
&&&&
IMGext
! =
'.jpg'
&&&&
IMGext
! =
'.jpeg'
&&&&
IMGext
! =
'gif') {img.value
=
''; Alert ('format is not right!');
Return
False
} Document.GetElementByid (
"
PreviewImg
"
) .innerhtml
=
"
"
}}
Script
>
<
INPUT
Type
= "file"
Name
= "f"
id
= "f"
ONCHANGE
= "previewPic ()"
/>
<
Div
id
= "previewIMG"
>
Div
>
Body
>
HTML
>