说明:

在进行拖放操作时,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. svn web页面管理svnadmin部署

    1.yum install subversion  创建svn目录  mdkir -p /data/svndirroot  建立svn库 svnadmin create /data/svndirroo ...

  2. java遍历给定目录,树形结构输出所有文件,包括子目录中的文件

    (转自:http://blog.csdn.net/gangwazi0525/article/details/7569701) import java.io.File; public class Rea ...

  3. svm心得体会(2)

    昨天和李老师讨论一会还是有所得的,虽然我发誓要早睡又泡汤了,又无原则晚睡了. 总结一下有这么几点心得认识: (1)MATLAB再带的svm工具箱得不到参数,必须在路径中添加libsvm工具箱,安装在M ...

  4. idea 插件的使用 进阶篇

    CSDN 2016博客之星评选结果公布    [系列直播]零基础学习微信小程序!      "我的2016"主题征文活动   博客的神秘功能 idea 插件的使用 进阶篇(个人收集 ...

  5. lydsy 2600(二分+中位数前缀和)米仓

    2600: [Ioi2011]ricehub Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 691  Solved: 359[Submit][Stat ...

  6. Permutations II

    Given a collection of numbers that might contain duplicates, return all possible unique permutations ...

  7. [LeetCode] Longest Increasing Path in a Matrix 矩阵中的最长递增路径

    Given an integer matrix, find the length of the longest increasing path. From each cell, you can eit ...

  8. [LeetCode] Interleaving String 交织相错的字符串

    Given s1, s2, s3, find whether s3 is formed by the interleaving of s1 and s2. For example, Given: s1 ...

  9. [LeetCode] Subsets II 子集合之二

    Given a collection of integers that might contain duplicates, S, return all possible subsets. Note: ...

  10. ElasticSearch+Kibana 索引操作( 附源码)

    一 前言 ElasticiSearch 简介 ElasticSearch是一个基于Lucene的搜索服务器.它提供了一个分布式多用户能力的全文搜索引擎,基于RESTful web接口.Elastics ...