We should be able to cite several commonly used asynchronous file upload function, the use of more frequent native Ajax and IFRAME framework, to achieve picture file upload, the following for everyone to share the picture file upload two ways: Native Ajax and IFRAME framework for everyone's reference, specific content as follows
Method One: Use the iframe frame to upload pictures
The HTML code is as follows:
<div class= "frm" > <form name= "uploadfrom" id= "Uploadfrom" action= "upload.php" "method="
post "target=" Tarframe "enctype=" Multipart/form-data ">
<input type=" file "id=" Upload_file "name=" Upfile ">
</ form>
<iframe src= "width=" 0 "height=" 0 "style=" display:none; "Name=" Tarframe "></iframe>
</div>
<div id= "msg" >
</div>
Index.js file:
$ (function () {
$ (' #upload_file '). Change (function () {
$ ("#uploadFrom"). Submit ();
}
); function Stopsend (str) {
var im= "
upload.php file:
<php
$file =$_files[' upfile '];
$name =rand (0,500000). Dechex (rand (0,10000)). ". JPG ";
Move_uploaded_file ($file [' Tmp_name '], "upload/images/". $name);
Call the JS function of the IFRAME parent window
echo "<script>parent.stopsend (' $name ') </script>";
? >
Method Two: Original ecological ajax File upload
PHP Code:
<?php
if (isset ($_files["myfile"))
{
$ret = array ();
$uploadDir = ' images '. Directory_separator.date ("Ymd"). Directory_separator;
$dir = DirName (__file__). Directory_separator. $uploadDir;
File_exists ($dir) | | (MkDir ($dir, 0777,true) && chmod ($dir, 0777));
if (!is_array ($_files["myfile" ["Name"]))//single file
{
$fileName = time (). Uniqid (). ". PathInfo ($_files["myfile"] ["name"]) [' extension '];
Move_uploaded_file ($_files["myfile"] ["Tmp_name"], $dir. $fileName);
$ret [' file '] = Directory_separator. $uploadDir. $fileName;
}
echo Json_encode ($ret);
>
The above is the entire content of this article, I hope that you learn to understand Ajax and the IFRAME framework to achieve picture file upload help.