分享一个HTML5实现拖放的实例代码

 !DOCTYPE HTML  html  head  meta charset= utf-8  title 拖放 /title  script type= text/javascript function init()  // (1) 拖放开始 source.addEventListener( dragstart , function(ev)  //(1) 向dataTransfer对象追加数据 var dt = ev.dataTransfer; dt.effectAllowed = all  //(2) 拖动元素为dt.setData( text/plain , this.id);  dt.setData( text/plain , 你好  }, false); // (3) dragend：拖放结束 dest.addEventListener( dragend , function(ev)  //不执行默认处理（拒绝被拖放） ev.preventDefault(); }, false); // (4) drop:被拖放 dest.addEventListener( drop , function(ev)  // 从DataTransfer对象那里取得数据 var dt = ev.dataTransfer; //(5) 不执行默认处理（拒绝被拖放） ev.preventDefault(); //停止事件传播 ev.stopPropagation(); }, false); /script  /head  body onload= init()  h5 请拖放 /h5  /html 

在上述的代码中，在页面加载时，自动触发inint()事件。该事件中包括拖放开始，被拖放和结束拖放三个函数。在浏览器中打开该网页，鼠标拖动显示到网页中的晚间图片，网页会自动加载要的内容。

【相关推荐】

1. 免费h5在线视频教程

2. HTML5 完整版手册

3. VeVb.com原创html5视频教程

以上就是分享一个HTML5实现拖放的实例代码的详细内容，其它编程语言

郑重声明：本文版权归原作者所有，转载文章仅为传播更多信息之目的，如作者信息标记有误，请第一时间联系我们修改或删除，多谢。