DataTransferItem.kind - Web API 接口参考 编辑

DataTransferItem.kind 是一个只读属性，它返回一个 DataTransferItem 用来表示拖拽项(drag data item)的类型: 一些文本或者一些文件。

语法

var itemKind = DataTransferItem.kind;

返回值

 DOMString 用来表示拖拽项(drag data item)的类型. 它的值必须是以下值中的一个:

'file'

拖拽项是一个文件。

'string'

拖拽项是一个普通的 Unicode 字符。

例子

BCD tables only load in the browser

下面这个例子是 kind 属性的用法.

function drop_handler(ev) {
 console.log("Drop");
 ev.preventDefault();
 var data = event.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 == 'file') &&
              (data[i].type.match('^image/'))) {
     // Drag data item is an image file
     var f = data[i].getAsFile();
     console.log("... Drop: File ");
   }
 }
}

规范

Specification	Status	Comment
HTML Living Standard kind	Living Standard	Initial version
HTML 5.1 kind	Recommendation	W3C snapshot of the WHATWG document.

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

查看更多

• Drag and drop
• Drag Operations
• Recommended Drag Types
• Dragging and Dropping Multiple Items
• DataTransfer test - Paste or Drag