dataTransfer 对象


提供了对于预定义的剪贴板格式的访问,以便在拖曳操作中使用。

DHTML元素属性列表

属性 描述
dropEffect 设置或获取拖曳操作的类型和要显示的光标类型。
effectAllowed 设置或获取数据传送操作可应用于该对象的源元素。
方法 描述
clearData 通过 dataTransfer 或 clipboardData 对象从剪贴板删除一种或多种数据格式。
getData 通过 dataTransfer 或 clipboardData 对象从剪贴板获取指定格式的数据。
setData 以指定格式给 dataTransfer 或 clipboardData 对象赋予数据。

注释

dataTransfer 对象使得自定义处理拖曳操作成为可能。你可通过 event 对象完成这种功能。

dataTransfer 对象可于源对象和目标对象中使用。典型用法是,setdata 方法用于源事件,以便提供关于将要进行传送的数据的数据。相应的,getData 方法用于目标事件以便确保获取的数据和数据格式。

此对象在 Microsoft® Internet Explorer 5 的脚本中可用。

DHTML代码举例

下面的例子使用了 dataTransfer 对象的 setdata 和 getData 方法通过快捷菜单执行拖曳操作。

<HEAD>
<SCRIPT>
var sAnchorURL;
function InitiateDrag()
/* setData 参数告诉源对象将数据传送为 URL 并提供
路径。*/
{
event.dataTransfer.setData("URL", oSource.href);
}
function FinishDrag()
/* 传递给 getData 的参数告诉目标对象所期望的数据
格式。*/
{
sAnchorURL = event.dataTransfer.getData("URL");
oTarget.innerText = sAnchorURL;
}
</SCRIPT>
</HEAD>
<BODY>
<A ID=oSource href="about:example_complete" onclick="return(false)"
ondragstart="InitiateDrag()">测试锚</A>
<SPAN ID=oTarget ondragenter="FinishDrag()">将链接拖曳到这里</SPAN>
</BODY>

dataTransfer 对象的更多相关文章

  1. HTML5 拖放(Drag 和 Drop)功能开发——浅谈dataTransfer对象

    [前言] 之前我已经为大家介绍过一篇有关HTML5中原生拖拽的相关知识了.今天为大家介绍HTML5拖拽中的其他一些关于dataTransfer对象的知识和应用. dataTransfer对象 之前的一 ...

  2. DataTransfer对象的一些总结

    所有元素都支持防止目标事件,但是这些元素默认是不允许释放的,如果拖动元素经过不允许放置的元素无论用户如何操作,都不会触发drop事件,不过可以把任何元素变成有效的放置目标.方法是重写dropenter ...

  3. dataTransfer对象

    HTML5拖拽的数据传输 虽然通过dragstart.drag和dragend事件实现了原生拖拽.但是这仅仅是拖拽,在IE6和IE7中还是有些拖拽问题,并且也没有实现数据的交换.为了实现数据的交换,I ...

  4. JS中dataTransfer对象在拖曳操作中的妙用。

    转载  原文  https://my.oschina.net/jiangli0502/blog/179197 dataTransfer对象提供了对于预定义的剪贴板格式的访问,以便在拖曳操作中使用. 通 ...

  5. HTML5拖拽功能中 dataTransfer对象详解

    有了HTML5,老板再也不用担心我们的上传了,再加上有拖拽上传是不是很酷.百度一下,有关HTML5拖拽上传的文章和实例不少,都缺不了一个至关重要的东东DataTransfer.但是详细介绍的不多,尤其 ...

  6. HTML5原生拖拽事件的值传递(三dataTransfer对象)

    引用一篇博客,讲解的比较详细:http://www.tuicool.com/articles/j6Zbam

  7. 拖动对象ondrag

    说明: 在进行拖放操作时,dataTransfer 对象用来保存被拖动的数据.它可以保存一项或多项数据.一种或者多种数据类型.dataTransfer对象有两个主要的方法:getData()方法和se ...

  8. DataTransfer(setData()方法)

    DataTransfer对象专门用来存储拖放时要携带的数据,它可以被设置为拖放事件对象的DataTransfer属性.---把拖动的数据存入其中setData有两个参数:1.第一个参数为携带数据的数据 ...

  9. HTML5 FileReader读取Blob对象API详解

    使用FileReader对象,web应用程序可以异步的读取存储在用户计算机上的文件(或者原始数据缓冲)内容,可以使用File对象或者Blob对象来指定所要读取的文件或数据.其中File对象可以是来自用 ...

随机推荐

  1. Anaconda+django写出第一个web app(五)

    今天开始学习网页风格和设计,就像python有Web框架一样,也有一些CSS框架.对于CSS框架,我们可以使用默认的样式,也可以在原基础上编辑修改.本教程使用的是materialize这个CSS框架[ ...

  2. HDU 5701 中位数计数 (思维题)

    题目链接 Problem Description 中位数定义为所有值从小到大排序后排在正中间的那个数,如果值有偶数个,通常取最中间的两个数值的平均数作为中位数. 现在有n个数,每个数都是独一无二的,求 ...

  3. Linux/Unix系统编程手册 第一章:历史和标准

    Unix的开发不受控于某一个厂商或者组织,是由诸多商业和非商业团体共同贡献进行演化的.这导致两个结果:一是Unix集多种特性于一身,二是由于参与者众多,随着时间推移,Unix实现方式逐渐趋于分裂. 由 ...

  4. 【FCS NOI2018】福建省冬摸鱼笔记 day5

    第五天,也是讲课的最后一天. 数据结构专题,讲师:杨志灿 他的blog我似乎找不到了……以前肯定是在百度博客里面.但是现在百度博客消失了. PPT做的很有感觉,说了很多实用的技巧. 我觉得其实是收获最 ...

  5. 【洛谷】【洛谷月赛】4月月赛Round 1/2

    洛谷月赛“月”来“月”丧了,一月更比一月丧,做得我十分不“月”…… 4月的两轮月赛,都只会T1,就写一下吧,等待后续更新…… 先看看Round1的T1: [R1T1] 网址:点我 [题意简述] 给定一 ...

  6. 脚本病毒分析扫描专题1-VBA代码阅读扫盲、宏病毒分析

    1.Office Macor MS office宏的编程语言是Visual Basic For Applications(VBA). 微软在1994年发行的Excel5.0版本中,即具备了VBA的宏功 ...

  7. python 结构化数据解析

    # -*- coding: utf-8 -*- # @Time : 2018/8/31 14:32 # @Author : cxa # @File : glomtest.py # @Software: ...

  8. 目标板通过nfs挂载根文件系统

    目标板挂载根文件系统的方法有两种(这里所说的服务端就是ubuntu,Ubuntu已经成功安装了nfs服务,并且保证服务端与目标板ping 通) 第一种:等待开发板启动之后去挂载,此时文件系统从Flas ...

  9. Android 浏览器启动应用程序

    点击浏览器中的URL链接,启动特定的App. 首先做成HTML的页面,页面内容格式如下: <a href="[scheme]://[host]/[path]?[query]" ...

  10. python网络编程-paramiko

    python基础学习日志day8-paramiko 一:简介 Python的paramiko模块,该模块机遇SSH用于连接远程服务器并执行相关操作 现有这样的需求:需要使用windows客户端,远程连 ...