您好,欢迎来到三六零分类信息网!老站,搜索引擎当天收录,欢迎发信息

当元素在HTML中被拖动时,执行一个脚本吗?

2024/2/23 2:44:31发布17次查看
使用 html 中的 ondragover html 属性在 html 中拖动元素时执行脚本。
示例您可以尝试运行以下代码来实现ondragover 属性 -
<!doctype html><html> <head> <style> .drag { float : left; width : 100px; height : 35px; border : 2px dashed #876587; margin : 15px; padding: 10px; } </style> </head> <body> <div class = "drag" ondrop = "drop(event)" ondragover = "dropnow(event)"> <p ondragstart = "dragstart(event)" ondrag = "draggingnow(event)" draggable = "true" id="dragtarget">drag!</p> </div> <div class = "drag" ondrop = "drop(event)" ondragover = "dropnow(event)"></div> <div id = "box"></div> <p>drag the left box to the right or drag the right box to the left.</p> <script> function dragstart(event) { event.datatransfer.setdata("text", event.target.id); } function draggingnow(event) { document.getelementbyid("box").innerhtml = "dragged successfully!"; } function dropnow(event) { event.preventdefault(); } function drop(event) { event.preventdefault(); var data = event.datatransfer.getdata("text"); event.target.appendchild(document.getelementbyid(data)); document.getelementbyid("box").innerhtml = "the element dropped successfully!"; } </script> </body></html>
以上就是当元素在html中被拖动时,执行一个脚本吗?的详细内容。
该用户其它信息

VIP推荐

免费发布信息,免费发布B2B信息网站平台 - 三六零分类信息网 沪ICP备09012988号-2
企业名录 Product