第06章__HTML5的元素拖拽汇总.ppt

拖放是一种常见的特性，即抓取对象以后拖到另一个位置。 在 HTML5 中，拖放是标准的一部分，任何元素都能够拖放。 Internet Explorer 9、Firefox、Opera 12、Chrome 以及 Safari 5 支持拖放。 6.1 HTML5拖拽实现方式 在HTML5中将元素的“draggable”属性设置为“true”后，对应的元素就可以被拖拽了。拖拽元素将触发一系列的事件，如下表所示 拖曳的步骤 设置元素为可拖放：为了使元素可拖动，把 draggable 属性设置为 true? 拖动什么：定义dragstart函数，规定当元素被拖动时，会发生什么。同时设置用dataTransfer.setData() 方法设置被拖数据的数据类型和值。 放到何处 ： ondragover 事件规定在何处放置被拖动的数据。默认地，无法将数据/元素放置到其他元素中。如果需要设置允许放置，我们必须阻止对元素的默认处理方式。 进行放置 –：会发生 drop 事件，要定义drop函数，处理被拖数据，通过 dataTransfer.getData(Text) 方法获得被拖的数据 。 6.2 dataTransfer对象 在HTML5中，dataTransfer对象专门用于处理拖拽过程中产生的数据信息，该对象的属性及说明如下表所示 dataTransfer对象常用方法包括 （1）se