html5---上传文件

浏览数：29 / 时间：2015年06月09日

<!DOCTYPE HTML>
<html>
    <head>
        <style>
         #box{
         width:150px;height:150px;border:1px dashed red;
         font-size:13px;line-height:150px;text-align:center;
         }
        </style>
        <script>
         window.onload=function  () {
          var box=document.getElementById("box");
          box.ondragenter=function  (e) {
          e.preventDefault()
          }
          box.ondragover=function  (e) {
          box.innerHTML="请松开"
           e.preventDefault()
          }
          box.ondragleave=function  (e) {
           box.innerHTML="请拖入上传的文件"
          e.preventDefault()
          }
          box.ondrop=function  (e) {
          var file=e.dataTransfer.files[0];
          var formData=new FormData(); 
           formData.append("aa",file);
          var xml=new XMLHttpRequest();
          xml.open("post","up.php");
          xml.send(formData);
           e.preventDefault()
          }
         }
        </script>
    </head>
    <body>
       <div id="box">
         请拖入上传的文件
       </div>
    </body>
</html>

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

html5---上传文件