文件读取

来源：互联网发布：php编程代码大全编辑：程序博客网时间：2024/05/29 16:45
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title></title>    <style>        * {            margin: 0;            padding: 0;            list-style: none;        }        #div1{            width: 200px;            height: 200px;            border: 1px dashed #000;            text-align: center;            line-height: 200px;            position: absolute;            left: 50%;            top: 50%;            margin-left: -100px;            margin-top: -100px;            display: none;        }    </style>    <script>        window.onload = function () {            var oDiv=document.querySelector('#div1');            var oT=document.querySelector('#t1');            var timer;            document.ondragover=function(){                clearTimeout(timer);                oDiv.style.display='block';                timer=setTimeout(function(){                    oDiv.style.display='none';                }, 100);            };            oDiv.ondragenter=function(){                oDiv.innerHTML='请释放鼠标';            };            oDiv.ondragleave=function(){                oDiv.innerHTML='请将文件拖着此区域';            };            oDiv.ondragover=function(){                return false;            };            oDiv.ondrop=function(ev){                var oFile=ev.dataTransfer.files[0];                var reader=new FileReader();                reader.onload=function(){                    // alert(reader.result);                    oT.value=this.result;                };                reader.readAsDataURL(oFile);        //base64 信息在reader.result身上                return false;            };        };    </script></head><body><textarea id="t1" cols="30" rows="10"></textarea>    <div id="div1">请将文件拖着此区域</div></body></html>
0 0