为什么无法实现效果?
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>返回鼠标指针的位置</title> <style type="text/css"> .container{ width: 200px; height: 200px; background: yellow; } .target{ width: 100px; height: 100px; background: pink; } </style> <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ // 此处补充代码 var dragstart=function(e){ e.dataTransfer.setData("Text",e.target.id); } var drop=function(e){ e.preventDefault(); var data=e.dataTransfer.getData("Text"); e.target.appendChild(document.getElementById(data)); } var dragover=function(e){ e.preventDefault(); } }); </script> </head> <body> <div id="container" class="container" ondrop="drop(event)" ondragover="dragover(event)"></div> <div id="target" class="target" draggable="true" ondragstart="dragstart(event)"></div> </body> </html>
1
收起
正在回答
2回答
第一,从同学上传的代码来看,这里是原生js 的写法,因此不需要使用<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"> </script>,因为是原生js的写法,因此也不需要使用 $(document).ready(function() {}), $(document).ready(function() {})是jq的初始化代码
第二,放在head中也是可以实现的,这里老师是习惯性的放在了</body>前面。
祝学习愉快!
组件化思想开发电商网页 18版
- 参与学习 人
- 提交作业 467 份
- 解答问题 4826 个
本路径带你通过系统学习HTML5、JavaScript、jQuery的进阶知识,不仅如此,还会学习如何利用组件化的思想来开发网页,知识点+案例,使得所学可以更好的得到实践。
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星