The method of dragging and dropping HTML5 files

This article mainly introduces the "HTML5 file drag and drop method" related knowledge, the editor through the actual case to show you the operation process, the operation method is simple and fast, practical, I hope this "HTML5 file drag and drop method" article can help you solve the problem.

Drag and drop (Drag and drop) is part of the HTML5 standard.

Drag and drop

Drag and drop is a common feature that grabs an object and then drags it to another location.

In HTML5, drag and drop is part of the standard, and any element can be dragged and dropped.

Browser support

Internet Explorer 9, Firefox, Opera 12, Chrome, and Safari 5 support drag and drop.

Note: drag and drop is not supported in Safari 5.1.2.

HTML5 drag and drop instance

The following example is a simple drag and drop example:

Example

Function allowDrop (ev)

{

Ev.preventDefault ()

}

Function drag (ev)

{

Ev.dataTransfer.setData ("Text", ev.target.id)

}

Function drop (ev)

{

Ev.preventDefault ()

Var data=ev.dataTransfer.getData ("Text")

Ev.target.appendChild (document.getElementById (data))

}