DataTransferItem.getAsString()
DataTransferItem.getAsString()
メソッドは、項目の kind
が プレーン Unicode 文字列 (すなわち kind
が string
)である場合に、ドラッグデータ項目の文字列データを引数に指定してコールバックを呼び出すメソッドです。
構文
// アロー関数
getAsString((data) => { /* … */ } )
// コールバック関数
getAsString(callbackFn)
// インラインコールバック関数
getAsString(function(data) { /* … */ })
引数
callbackFn
-
以下の引数を受け取るコールバック関数です。
data
-
データ転送アイテムの文字列データです。
返値
なし (undefined
)。
例
この例では、 drop
イベントハンドラーにおいて、 getAsString()
メソッドを インライン関数 として使用しているところを示しています。
function drop_handler(ev) {
console.log("Drop");
ev.preventDefault();
const data = ev.dataTransfer.items;
for (let 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((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
const f = data[i].getAsFile();
console.log("… Drop: File ");
}
}
}
仕様書
Specification |
---|
HTML Standard # dom-datatransferitem-getasstring-dev |
ブラウザーの互換性
BCD tables only load in the browser