Correction status:qualified
Teacher's comments:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8" > <meta name="description" content=""/> <meta name="keywords" content=""/> <title>ajax上传文件</title> <script type="text/javascript"> //加载提交事件给from设置提交事件 window.onload=function(){ var fm=document.getElementsByTagName('form')[0]; fm.onsubmit=function(evt){ //1、收集信息--普通表单信息和文件信息 var fd=new FormData(fm);//代表事件的元素节点对象 //2、ajax传递表单信息到服务器 var xhr=new XMLHttpRequest();//传递数据 xhr.onreadystatechange=function(){ //判断 if(xhr.readyState==4){ alert(xhr.responseText);//打印传输的信息 } } xhr.open('POST','./02.php');//数据传输格式 ,服务器端 xhr.send(fd);//发送 //阻止事件流 evt.preventDefault();//阻止浏览器跳转 } } </script> </head> <body> <h2 align="center">用ajax实现上传文件</h2> <form action="./02.php" method="POST" enctype="multipart/form-data"> <fieldset> <legend align="center">文件上传</legend> <p><strong>用户姓名:</strong><input type="text" name="username"/></p> <p><strong>选择文件:</strong><input type="file" name="upload"></p> </fieldset> <p align="center"><button type="submit" name="submit" >上传</button></p> </form> </body> </html>
点击 "运行实例" 按钮查看在线实例