Originally want to upload pictures with Plug-ins, and later wrote a simple JS to achieve asynchronous image upload, not much to say on the code is very simple
upload.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);
}
?>
Index.html
HTML5 Ajax Upload File
<script type= "Text/javascript" >
var xhr;
function Createxmlhttprequest ()
{
if (window. ActiveXObject)
{
XHR = new ActiveXObject ("Microsoft.XMLHTTP");
}
else if (window. XMLHttpRequest)
{
XHR = new XMLHttpRequest ();
}
}
function Upladfile ()
{
var fileobj = document.getElementById ("file"). Files[0];
var filecontroller = ' upload.php ';
var form = new FormData ();
Form.append ("MyFile", fileobj);
Createxmlhttprequest ();
Xhr.onreadystatechange = Handlestatechange;
Xhr.open ("Post", Filecontroller, True);
Xhr.send (form);
}
function Handlestatechange ()
{
if (xhr.readystate = 4)
{
if (Xhr.status = = Xhr.status = 0)
{
var result = Xhr.responsetext;
var json = eval ("+ result +"));
Alert (' Picture link: \ n ' +json.file ');
}
}
}
</script>
Picture
Browse...
Upload