diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/zh-cn/web/api/datatransferitem/getasstring | |
parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip |
initial commit
Diffstat (limited to 'files/zh-cn/web/api/datatransferitem/getasstring')
-rw-r--r-- | files/zh-cn/web/api/datatransferitem/getasstring/index.html | 102 |
1 files changed, 102 insertions, 0 deletions
diff --git a/files/zh-cn/web/api/datatransferitem/getasstring/index.html b/files/zh-cn/web/api/datatransferitem/getasstring/index.html new file mode 100644 index 0000000000..3b8147f7f6 --- /dev/null +++ b/files/zh-cn/web/api/datatransferitem/getasstring/index.html @@ -0,0 +1,102 @@ +--- +title: DataTransferItem.getAsString() +slug: Web/API/DataTransferItem/getAsString +translation_of: Web/API/DataTransferItem/getAsString +--- +<div>{{APIRef("HTML Drag and Drop API")}}</div> + +<p> <strong><code>DataTransferItem.getAsString()</code></strong> 当DataTransferItem对象的kind属性是一个普通Unicode字符串时,该方法会用 DataTransferItem对象的kind属性作为入参来执行传入的回调函数 (i.e. <code>kind</code> is <code>string</code>).</p> + +<h2 id="示例">示例</h2> + +<pre class="syntaxbox notranslate"><em>dataTransferItem</em>.getAsString(callback); +</pre> + +<h3 id="Parameters">Parameters</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>A callback function that has access to the {{domxref("DataTransferItem","data transfer item's")}} string data. See {{anch("Callback")}} below for details.</dd> +</dl> + +<h3 id="Return_value">Return value</h3> + +<p>{{jsxref("undefined")}}</p> + +<h2 id="Callback">Callback</h2> + +<p>The callback parameter is a callback function which accepts one parameter:</p> + +<dl> + <dt>{{domxref("DOMString")}}</dt> + <dd>The drag data item's string data.</dd> +</dl> + +<p>The callback return value is <code>undefined</code>.</p> + +<h2 id="Example">Example</h2> + +<p>This example shows the use of the <code>getAsString()</code> method as an <em>inline function</em> in a {{event("drop")}} event handler.</p> + +<pre class="brush: js notranslate">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 "); + } + } +} +</pre> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', 'interaction.html#dom-datatransferitem-getasstring','getAsString()')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', 'editing.html#dom-datatransferitem-getasstring','getAsString()')}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot fo HTML WHATWG document</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("api.DataTransferItem.getAsString")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{domxref("DataTransfer.getData()")}}</li> +</ul> |