HTML draggable 事件属性

zoukankan html css js c++ java

HTML draggable 事件属性
[
  HTML 事件属性

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

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

<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Break易站(breakyizhan.com)</title> <style type="text/css"> #div1 {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
查看全文

相关阅读:
bat学习
 Eclipse调试方法及快捷键
 JDK中的设计模式
 开源-自由-乔布斯
 AOP
编程语言
 [LeetCode] 160. Intersection of Two Linked Lists（两个单链表的交集）
[LeetCode] 198. House Robber（小偷）
[LeetCode] 155. Min Stack（最小栈）
[LeetCode] 1. Two Sum（两数之和）

原文地址：https://www.cnblogs.com/breakyizhan/p/13263448.html

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

HTML draggable 事件属性

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

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

HTML draggable 事件属性：语法

HTML draggable 事件属性：属性值