<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "/TR/xhtml1/DTD/xhtml1-strict.dtd"><html><head><title>新建网页</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="description" content="" /><meta name="keywords" content="" /><script type="text/javascript">//javascript+ajax无刷新方式form表单提交window.onload = function(){var fm = document.getElementsByTagName('form')[0];//表单提交事件fm.onsubmit = function(evt){//① 收集用户输入的表单域信息[FormData]var fd = new FormData(fm);//普通表单域 + 上传文件域信息//② 并把收集的信息提交给服务器端[ajax]var xhr = new XMLHttpRequest();xhr.onreadystatechange = function(){if(xhr.readyState==4){alert(xhr.responseText);}}xhr.upload.onprogress = function(evt){//该事件每间隔100ms左右就执行一次，//并可以通过事件对象感知附件信息//附件已经上传大小var lod = evt.loaded;//附件总大小var tal = evt.total;//上传百分比var per = Math.floor((lod/tal)*100) + "%";//给son的div设置宽度百分比document.getElementById('son').innerHTML= per;document.getElementById('son').style.width = per;}xhr.open('post','./06.php');xhr.send(fd);//阻止浏览器form表单的提交动作evt.preventDefault();}}</script><style type="text/css">#pat {width:460px; height:40px;border:4px solid blue;}#son {width:0; height:100%; background-color:lightblue;}</style></head><body><h2>用户注册(无刷新方式附件上传)</h2><form method="post" action="./1001.php"><p>用户名：<input type="text" id="mingzi" name="username" /></p><p>密码：<input type="password" id="mima" name="userpwd" /></p><p>邮箱：<input type="text" id="youxiang" name="useremail" /></p><div id="pat"><div id="son"></div></div><p>头像：<input type="file" id="touxiang" name="userpic" /></p><p><input type="submit" value="注册" /></p></form></body></html>
<?php//收集到：普通表单域信息 + 上传文件域信息//echo "post:";//print_r($_POST);//echo "file:";//print_r($_FILES);if($_FILES['userpic']['error']>0){exit('附件有错误');}//附件上传逻辑$path = "./upload/";$name = date("YmdHis").'-'.mt_rand(1000,9999);//附件的名字$name_arr = explode('.',$_FILES['userpic']['name']);$ext = ".".$name_arr[count($name_arr)-1]; //附件的后缀$pathname = $path.$name.$ext;//附件真实路径名if(move_uploaded_file($_FILES['userpic']['tmp_name'],$pathname)){echo "success";}else{echo "fail";}
