纯JS控制DIV选择范围移动与复制(改进版)

时间:2011-03-26 13:01:22
【文件属性】:
文件名称:纯JS控制DIV选择范围移动与复制(改进版)
文件大小:17KB
文件格式:HTML
更新时间:2011-03-26 13:01:22
javascript 批量删除 批量复制 批量移动 范围选择 未选择状态下,单击DIV上可选中此DIV。

未选择状态下,单击在背景上按住左键拖动产生范围虚线框,在此范围虚线框内的DIV边框变粗变色为被选中,虚线框外的则不被选中。

已选择状态下,按住Ctrl可再次选择,按住Ctrl的同时,单击在DIV上,如果DIV已被选中则取消本节点选择,反之选中此节点。

已选择状态下,按住Ctrl的同时,如果单击在背景上按住左键拖动产生范围虚线框,在此范围虚线框内的DIV边框变粗变色为被选中,虚线框外的如果为上次已选中的则不仍然选中,否则不选中。

释放后虚线消失,需要添加选择可重复第“3”,“4”步操作,多次选择的节点选中。

快捷键选择,Ctrl +A全选,Ctrl +X反选,Ctrl +Z取消选择。

移动位置,选中DIV后,如果单选组选中移动(-)(默认,快捷键为“-”)按住左键拖动位置后释放可批量移动位置,产生一段过度动画,不撤销选择的DIV可多次移动,如已移动完毕按Ctrl+Z撤销选择即可。

复制节点,选中DIV后,如果单选组选中复制(+,快捷键为“+”),按住左键拖动位置后释放,产生一段过度动画,即复制选中的DIV,如复制完毕按Ctrl+Z取消选择即可。

删除选中DIV,选中DIV后,按下按钮或者快捷键“Delete”、“.”可删除所有选中的DIV。

网友评论

  • 功能还是很强大了谢了。
  • 还没看呢,研究一下闲
  • 效果很好,实现了相应的功能
  • 效果不错,能够应用
  • 很不错了,有点点小Bug,自己研究改进下
  • 效果还可以吧
  • 效果不错,能够应用
  • 效果不错,能够应用
  • 可以使用,但有BUG
  • 效果不错,能够应用
  • 效果不错,能够应用
  • 效果可以, 可用于当前项目, 有些地方还需要改进
  • 效果不错,能够应用,自己还要再改下js代码
  • 出于对JS的好奇,当时下了来玩,蛮好耍的!也比较有用,不错。