说明:

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

setData("Text",ev.target.id):用指定的数据格式把数据插入 DataObject 对象。

语法 object.SetData [data],[format]

getData()方法可以取得由setData()方法保存的值。setData()方法的第一个参数,也是getData()方法唯一的一个参数,是用来保存数据类型的字符串,取值是”text”或”URL”。

实现步骤:

1、对要拖动的对象定义draggable="ture"

2、在要拖动的对象上定义ondragstart="drag(event)"

3、在目标对象上定义ondragover="allowdrag(event)"和ondrop="drop(event)"

拖拽相关方法:

ondragstart 拖拽前触发

ondragend 拖拽结束触发 

ondragenter 相当于onmouseover

ondragleave 相当于onmouseout

ondragover 进入目标、离开目标之间,连续触发

ondrop 释放鼠标的时候触发

preventDefault() 阻止默认事件

拖动对象ondrag的更多相关文章

  1. [ActionScript 3.0] AS3 用于拖动对象时跟随鼠标的缓动效果

    package com.fylibs.components.effects { import flash.display.DisplayObject; import flash.events.Even ...

  2. Qt编写可拖动对象+背景地图+多种样式+多种状态(开源)

    在很多项目应用中,需要根据数据动态生成对象显示在地图上,比如地图标注,同时还需要可拖动对象到指定位置显示,能有多种状态指示,为此特意编写本控件,全部开源出来,欢迎大家提建议.同时多多支持整套自定义控件 ...

  3. [ActionScript 3.0] AS3 用于拖动对象时一次一页的缓动

    package com.fylibs.components.effects{ import com.tweener.transitions.Tweener; import flash.display. ...

  4. wpf 快速建立可以拖动对象

    1.引用两个.net 程序集 2.xaml name space导入 xmlns:i ="http://schemas.microsoft.com/expression/2010/inter ...

  5. vc++ mfc中拖动效果的实现 借助于CImageList

    拖动是界面编程频繁使用的一个效果,在windows系统下可谓大行其道.纵观时下的应用软件几乎各个都支持各种各样拖动的效果,windows7更是把拖动做到了极致.其实说起来拖动的实现也很简单,对于有句柄 ...

  6. 使用jquery实现简单的拖动效果,分享源码

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAkEAAAERCAIAAADzAOSQAAALRklEQVR4nO3dW5LaaAKEUfa/NkfMGu

  7. JavaScript 实现鼠标拖动元素

    一.前言 最开始实现鼠标拖动元素的目的就是在一个页面上拖动很多小圆点,用于固定定位,然后在复制HTML,粘贴在页面的开发代码中,就是这么一个功能,实现了很多遍,都没有做好,不得已采用了jQuery.f ...

  8. Canvas中鼠标获取元素并拖动技术

    Silverlight拖动,需要Canvas. Canvas管网定义: 定义一个区域,在该区域中可以使用相对于该区域的坐标显式定位子元素. XAML <Canvas ...> oneOrM ...

  9. 使用jQuery实现简单的拖动效果

    转自:http://www.muzilei.com/archives/136 如何实现拖动效果? 浏览DEMO 首先分析下拖动效果原理: 1.当鼠标在被拖动对象上按下鼠标(触发onmousedown事 ...

随机推荐

  1. PostgreSQL杀掉死锁的链接

    查到对应的用户的活动连接: select * from pg_stat_activity where username="xxx"; 杀掉死锁的连接: select pg_term ...

  2. 你该知道的-SQL里的这些新语法-函数

    前言 最近帮客户做数据库优化的时候发现客户系统使用了很多函数,自己竟然不知道是干啥的,好歹做过好几年开发的我必然不能忍!于是翻了翻资料自己学习了一下随便也分享给群友. 巧用函数的霸气作用———我做开发 ...

  3. exynos4412中断编程

    中断概述 我们知道,ARM核能处理的异常有7种,但仅仅区分异常的种类显然不能够满足需求.拿手机来说,触摸屏幕和按下音量键可能都是irq异常,但是ARM并不能将他们区分开,而事实的情况是针对这两种中断, ...

  4. 基于面向对象的图片轮播(js原生代码)

    无论你想走多远,你都需要不断地走下去.前端最精华的便是原生的js,这也是我们前端工程师的技术分层的重要指标,也提现这你的代码能力,开发的水平.废话不多说,进入今天的主要分享————基于面向对象思想的图 ...

  5. jsp中的@include与jsp:include区别详解

    1 前言 搞java开发的人也许都知道在jsp中引入项目中其他文件有如下两种方式 <%@include file="xxx.jsp"%> <jsp:include ...

  6. ubuntu 安装 vmware 12

    安装VMware Workstation 12 ubuntu15.10安装VMware Workstation12的步骤如下: 1.在 https://download3.vmware.com/sof ...

  7. python爬虫学习(7) —— 爬取你的AC代码

    上一篇文章中,我们介绍了python爬虫利器--requests,并且拿HDU做了小测试. 这篇文章,我们来爬取一下自己AC的代码. 1 确定ac代码对应的页面 如下图所示,我们一般情况可以通过该顺序 ...

  8. linux-虚拟机centos6.5安装tools

    1.在VMWare选VM -> Install VMWare Tools-,就会在桌面出现VMWare Tools图示让你安裝 2.进入CentOS桌面后,将光盘打开,看到了VMWareTool ...

  9. Android开发用过的十大框架

    http://blog.csdn.net/u011200604/article/details/51695096 本文系多方综合与转载整合,意在Android开发中能够知道和使用一些好用的第三方支持, ...

  10. jquery 的一些基本操作

    日常使用中的操作记录,持续更新中: ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Fire ...