How to get selected items from dragstart event in Chrome? Is dataTransfer.getData broken?

I am part of a team that runs on a Java application that, among other things, helps people organize and comment on information from the Internet. We are currently using the Firefox plugin, which attaches a container attribute that contains the document source, which allows you to automatically drag and drop text. This will not always result in the source document, because only the text is transmitted when the selection does not intersect the html tags. eg

<p container="http://www.somesite.com/blah.html">this is text from a site</p><p container="http://www.somesite.com/blah.html">this is more text from a site</p>

So, if only text is selected , the html tags never intersect, and the browser thinks that the information about the surround tag and its container attribute will be undesirable; therefore he ignores him.

So, I decided to create a Chrome extension that will use some of the great HTML5 features to drag from a browser page that is unloaded from a Java application, including the source document. FYI, Chrome extensions are based on Javascript.

Correctly, what needs to be done is to register the dragstart event in the document, which will allow me to access the contents of the drag and drop, and also let me enter a meta tag that contains the location of the source document.

In accordance with the current standard http://dev.w3.org/html5/spec/Overview.html#the-datatransfer-interface this should be possible using the dataTransfer interface .

, dragstart, dataTransfer. Chrome Javascript, :

window.addEventListener("dragstart", function(event) {
console.log(event.dataTransfer.types);
console.log(event.dataTransfer.getData("Text"));     });

- . Chrome "null" , "undefined" . Javascript Firebug, - , , :

DOMStringList { 0="text/_moz_htmlcontext", 1="text/_moz_htmlinfo", 2="text/html", more...}
whatever text was selected

, setData event.dataTransfer, , . , , , . Chrome Javascript, - :

window.addEventListener("dragstart", function(event) {
    event.dataTransfer.setData("Text","I made this here for you!");
});

, .:( - ? , Chrome, .

!

+2
2

WebKit, , , Chrome, , getData. dragstart dragover. , .

+4

:

event.dataTransfer = event.originalEvent.dataTransfer;

.

+1

Source: https://habr.com/ru/post/1787549/


All Articles