Day13 鼠标右键菜单复制粘贴

返回目录

 

以下知识源码位置: [Git:  https://gitee.com/zhouweng/mini_sheet  version=ddaf43a6d4c067acf2d82550b6853d1a72731bc0]

源代码回滚版本,参考这里[ https://blog.csdn.net/u010593516/article/details/113767587 ]

 

今天,我们为单元格区域添加鼠标右键菜单,并且在菜单上增加复制、粘贴选项,由于粘贴使用的是javascript的paste事件,所以目前只能通过键盘的ctrl+v进行处理,无法响应到鼠标右键的paste选项,具体效果如下:

 

 

1.修改文件:

1.1. controllers/constant.js: 增加函数rightclickHTML(),定义了鼠标右键菜单项的两个选单,copy和paste;

1.2.global/createdom.js: 在页面初始化阶段,通过 .append(),把1.1.定义的 右键菜单元素追加到 body上面;

1.3.util.util.js: showrightclickmenu()这个方法通过修改元素样式,在界面把右键菜单显示出来;

1.4.controllers/handler.js: 在单元格区域增加 .mouseup(),在鼠标右键弹起的时候,调用1.3定义的方法,把右键菜单显示出来;

1.5.优化性调整:在 luckySheetl里面,存在比较多的循环依赖关系,导致文件之间的调用关系错综复杂,维护起来比较困难。通过新建一个 utils/format.js ,我们把之前handler.js和 setdata.js的循环依赖解开,达到逻辑更加清晰的目的。

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值