Preview before the image

xiaoxiao2021-04-06  286

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

>

转载请注明原文地址:https://www.9cbs.com/read-132305.html

New Post(0)