Php Avatar upload preview instance code, php Avatar preview instance

Source: Internet
Author: User

Php Avatar upload preview instance code, php Avatar preview instance

It is no stranger to everyone to upload images. However, in future projects, you may not be asked to submit and refresh images on pages, such as uploading portraits, you must confirm the upload after selecting the photo album. Instead of using the form, click submit to refresh the upload. I will introduce two types of asynchronous non-Refresh upload images + image preview: first, upload using the ready-made uploadfy plug-in, there are many instances on the Internet.

However, I will focus on the second method: upload images through Ajax. Because the uploadfy plug-in requires devices to support Flash in swf format, most mobile phones cannot use the first method. First, let me talk about the upload principle: control the file text field through js. After selecting a photo, submit the form asynchronously through Ajax, and then use the position of the image as the return value, use js to set the src attribute of img as the return value.

Upload Avatar area:

Code:

<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

Upload processing page:

<? Phpif ($ _ FILES ["file"] ["error"]) {echo $ _ FILES ["file"] ["error"];} else {if ($ _ FILES ["file"] ["type"] = "image/jpeg" | $ _ FILES ["file"] ["type"] = "image/png ") & $ _ FILES ["file"] ["size"] <1024000000) {$ fname = ". /img /". date ("YmdHis "). $ _ FILES ["file"] ["name"]; $ filename = iconv ("UTF-8", "gb2312", $ fname); if (file_exists ($ filename )) {echo "<script> alert ('the file already exists! '); </Script> ";}else {move_uploaded_file ($ _ FILES [" file "] [" tmp_name "], $ filename ); unlink ($ _ POST ["tp"]); echo "<script> parent. showimg ('{$ fname}'); </script> ";}}}

Principle:

Use the enctype = "multipart/form-data" attribute of form to temporarily place the file to the tmp directory in the wamp folder, and then store the file in the system through the background php program.

The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.