加载中…
个人资料
大千世界
大千世界
  • 博客等级:
  • 博客积分:0
  • 博客访问:54,118
  • 关注人气:10
  • 获赠金笔:0支
  • 赠出金笔:0支
  • 荣誉徽章:
相关博文
推荐博文
谁看过这篇博文
加载中…
正文 字体大小:

【HTML5新特性基础NO.2】拖放

(2017-11-30 11:55:00)
标签:

html5

javascript

拖放

分类: html5
1.HTML5拖放:
           拖放(Drag 和 drop)是HTML5标准的组成部分。
2.拖动开始:
          ondrastart: 调用了一个函数, drag(event),它规定了被拖动的数据
3.设置拖动数据:
          setData():设置被拖动数据的数据类型和值
4.放入位置
          ondargover:事件规定在何处放置被拖动的数据
5.放置:
         ondrop:当放放置被拖数据时,会发生drop事件

参考:

新建一个index.html文件

【HTML5新特性基础NO.2】拖放

index.html

第一,拖动什么?用ondragstart和setData()

ondragstart 属性调用了一个函数,drag(event),它规定了被拖动的数据。

第二,拖放到何处?用ondragover,ondragover 事件规定在何处放置被拖动的数据。

这要通过调用 ondragover 事件的 event.preventDefault() 方法。

第三,放置到哪里?用ondrop,当放置被拖数据时,会发生 drop 事件。

另外新建一个demo.js文件

【HTML5新特性基础NO.2】拖放

demo.js

【HTML5新特性基础NO.2】拖放
【HTML5新特性基础NO.2】拖放

拖放效果图

0

阅读 评论 收藏 转载 喜欢 打印举报/Report
  • 评论加载中,请稍候...
发评论

    发评论

    以上网友发言只代表其个人观点,不代表新浪网的观点或立场。

      

    新浪BLOG意见反馈留言板 电话:4000520066 提示音后按1键(按当地市话标准计费) 欢迎批评指正

    新浪简介 | About Sina | 广告服务 | 联系我们 | 招聘信息 | 网站律师 | SINA English | 会员注册 | 产品答疑

    新浪公司 版权所有