(Firefox supports some Gecko-specific extensions to the DataTransfer object, but those extensions will only work on Firefox.)Įach DataTransfer object contains an items property, which is a list of DataTransferItem objects. The DragEvent and DataTransfer interfaces should be the only ones needed to add HTML Drag and Drop capabilities to an application. DataTransfer objects also have methods to add or remove items to the drag's data. The DragEvent interface has a constructor and one dataTransfer property, which is a DataTransfer object.ĭataTransfer objects include the drag event's state, such as the type of drag being done (like copy or move), the drag's data (one or more items), and the MIME type of each drag item. The HTML Drag and Drop interfaces are DragEvent, DataTransfer, DataTransferItem and DataTransferItemList. The dragend event handler can check the value of the dropEffect property to determine if the drag operation succeeded or not.įor more information about handling the end of a drag operation, see: This event fires regardless of whether the drag completed or was canceled. function dragstart_handler ( ev ) Īt the end of a drag operation, the dragend event fires at the source element - the element that was the target of the drag start. an item is dropped on a valid drop target. a dragged item is being dragged over a valid drop target, every few hundred milliseconds.
a dragged item leaves a valid drop target. a dragged item enters a valid drop target. a drag operation ends (such as releasing a mouse button or hitting the Esc key see Finishing a Drag.) a dragged item (element or text selection) is dragged.
A typical drag operation begins when a user selects a draggable element, continues when the user drags the element to a droppable element, and then ends when the user releases the dragged element.ĭuring drag operations, several event types are fired, and some events might fire many times, such as the drag and dragover events.Įach drag event type has an associated event handler: Event
HTML drag-and-drop uses the DOM event model and drag events inherited from mouse events.
0 kommentar(er)
