您好,欢迎访问一九零五行业门户网

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

使用 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中被拖动时,执行一个脚本吗?的详细内容。
其它类似信息

推荐信息