HTML draggable 事件属性

[


  HTML 事件属性

HTML draggable 事件属性的定义和用法

draggable 属性规定元素是否可拖动。

<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Break易站(breakyizhan.com)</title> <style type="text/css"> #div1 {width:350px;height:70px;padding:10px;border:1px solid #aaaaaa;} </style> <script type="text/javascript"> function allowDrop(ev) { ev.preventDefault(); } function drag(ev) { ev.dataTransfer.setData("Text",ev.target.id); } function drop(ev) { var data=ev.dataTransfer.getData("Text"); ev.target.appendChild(document.getElementById(data)); ev.preventDefault(); } </script> </head> <body> <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div> <br /> <p id="drag1" draggable="true" ondragstart="drag(event)">这是一段可移动的段落。请把该段落拖入上面的矩形。</p> </body> </html>

提示：可以修改代码后运行

提示： 链接和图像默认是可拖动的。

提示： draggable 属性经常用于拖放操作。

HTML draggable 事件属性：HTML 4.01 与 HTML5之间的差异

draggable 属性是 HTML5 新增的。

HTML draggable 事件属性：语法

<element draggable="true|false|auto">

HTML draggable 事件属性：属性值

值	描述
true	规定元素是可拖动的。
false	规定元素是不可拖动的。
auto	使用浏览器的默认特性。


  HTML 事件属性

]

本文标题：HTML draggable 事件属性 - Break易站

转载请保留页面地址：https://www.breakyizhan.com/html/9983.html

posted on 2020-07-07 21:41 MrAit 阅读(784) 评论(0) 编辑收藏举报

刷新页面返回顶部

MrAit

HTML draggable 事件属性

HTML draggable 事件属性的定义和用法

HTML draggable 事件属性：HTML 4.01 与 HTML5之间的差异

HTML draggable 事件属性：语法

HTML draggable 事件属性：属性值

导航

公告