DataTransferItem.getAsString()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

DataTransferItem.getAsString() 当 DataTransferItem 对象的 kind 属性是一个普通 Unicode 字符串时,该方法会用 DataTransferItem 对象的 kind 属性作为入参来执行传入的回调函数 (i.e. kind is string).

示例

dataTransferItem.getAsString(callback);

Parameters

callback

A callback function that has access to the data transfer item's string data. See Callback below for details.

Return value

Callback

The callback parameter is a callback function which accepts one parameter:

DOMString

The drag data item's string data.

The callback return value is undefined.

Example

This example shows the use of the getAsString() method as an inline function in a drop event handler.

js
function drop_handler(ev) {
  console.log("Drop");
  ev.preventDefault();
  var data = ev.dataTransfer.items;
  for (var i = 0; i < data.length; i += 1) {
    if (data[i].kind == "string" && data[i].type.match("^text/plain")) {
      // This item is the target node
      data[i].getAsString(function (s) {
        ev.target.appendChild(document.getElementById(s));
      });
    } else if (data[i].kind == "string" && data[i].type.match("^text/html")) {
      // Drag data item is HTML
      console.log("... Drop: HTML");
    } else if (
      data[i].kind == "string" &&
      data[i].type.match("^text/uri-list")
    ) {
      // Drag data item is URI
      console.log("... Drop: URI");
    } else if (data[i].kind == "file" && data[i].type.match("^image/")) {
      // Drag data item is an image file
      var f = data[i].getAsFile();
      console.log("... Drop: File ");
    }
  }
}

Specifications

Specification
HTML
# dom-datatransferitem-getasstring-dev

Browser compatibility

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
getAsString

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

See also