前言：
此时看官们对“html拖放功能”大致比较注意，我们都想要分析一些“html拖放功能”的相关内容。那么小编同时在网摘上网罗了一些有关“html拖放功能””的相关资讯，希望兄弟们能喜欢，同学们快快来学习一下吧！html代码：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>本地拖放</title><style>#imgContainer{background-color: #cccccc;width: 500px;height: 500px;}</style></head><body><div id="imgContainer"></div><script src="js/app1.js"></script></body></html> app1.js 源码：
var imgContainer;window.onload=function () {imgContainer=document.getElementById("imgContainer");imgContainer.ondragover=function(e){e.preventDefault();//阻止默认事件}imgContainer.ondrop=function (e) {e.preventDefault();//阻止默认事件var f=e.dataTransfer.files[0];//获取对象var fileReader=new FileReader();//创建读取信息对象//监听事件fileReader.onload=function (e) {imgContainer.innerHTML="<img src=\""+fileReader.result+"\">";}fileReader.readAsDataURL(f);//读取地址}} 版权声明：
本站文章均来自互联网搜集，如有侵犯您的权益，请联系我们删除，谢谢。
标签： #html拖放功能
