前一段时间公司要对上传列表中多文本输入框添加富文本编辑功能,所以最初的想法是引入富文本编辑器插件,对每个多文本输入框实例化一次。但是上传列表还有一个可以拖拽排序的功能,在初次实例化以后,再拖拽元素就会出现富文本编辑器功能无法使用。

原因:拖拽排序的原理是对被拖拽元素clone一个副本,在拖拽完成以后再将DOM复制到确定的位置;DOM结构发生了变化,被拖放到的位置的DOM元素实际是复制过去的副本,之前初始化的功能(绑定的事件)都无法使用(事件代理,jquery.on()),解决办法,拖拽的元素完成拖拽以后都需要重新实例化一次功能。

拖拽对DOM的影响的更多相关文章

  1. vue 拖拽移动(类似于iPhone虚拟home )

    vue 移动端 PC 兼容 元素 拖拽移动  效果演示 事件知识点 移动端 PC端 注释 touchstart mousedown 鼠标/手指按下事件 touchmove mousemove 鼠标/手 ...

  2. html5 Sortable.js 拖拽排序源码分析

    最近公司项目经常用到一个拖拽 Sortable.js插件,所以有空的时候看了 Sortable.js 源码,总共1300多行这样,写的挺完美的.   本帖属于原创,转载请出名出处. 官网http:// ...

  3. jquery.dad.js实现table的垂直拖拽(并取到当前拖拽对象)

    http://sc.chinaz.com/jiaoben/161202572210.htm 1.首先官网实例,实现的都是div为容器的元素拖拽,示例如下: 2.最近的项目,要实现tbody的每一行tr ...

  4. textarea的拖拽怎么解决

    textarea文本域在页面中是可以拖动的,即时你给了固定的宽度和高度,但这在我们页面布局中,使我们不需要的,因为可拖拽很多时候会影响我们页面的布局和整体的美观度. css3提供了一个resize属性 ...

  5. 一个全新的Vue拖拽特性实现:“调整尺寸”部分

    关于拖拽 CabloyJS提供了完备的拖拽特性,可以实现移动和调整尺寸两大类功能,这里对调整尺寸的开发进行阐述 关于移动的开发,请参见:拖拽:移动 演示 开发步骤 下面以模块test-party为例, ...

  6. 通过Ztree生成页面html元素Dom树,以及拖拽改变元素的位置

    zTree 是一款依靠 jQuery 实现的多功能 "树插件",http://www.treejs.cn/v3/main.php#_zTreeInfo,功能强大,不多赘述. 下面我 ...

  7. 鼠标拖拽定位和DOM各种尺寸详解

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. div/dom元素拖拽缩放插件,纯js实现拖拽缩放,不依赖jQuery~

    产品需求,需要用到对div(dom)进行拖拽缩放操作,看到有好多插件,要么依赖jQuery,要么文件太大. 封装了一个插件,不压缩状态下5KB. html <!DOCTYPE html> ...

  9. jQuery的DOM操作实例(2)——拖拽效果&&拓展插件

    一.原生JavaScript编写拖拽效果 二.jQuery编写的拖拽效果 三.在jQuery中拓展一个拖拽插件

随机推荐

  1. 4.bootstrap练习笔记-内容区块

    bootstrap练习笔记-内容区块 1.bootstrap中,采用的全部是div布局,把你的内容首先要包含在一个大的DIV区块当中 2.然后再写一个div.container,这个div里面存放真正 ...

  2. SQL Server日志文件(LDF文件)

    一.日志文件过大处理方法: 1.设置数据库模式为简单模式:ALTER DATABASE 数据库名 SET RECOVERY SIMPLE 或者选中数据库-属性-选项-恢复模式设置为简单. 2.收缩日志 ...

  3. Moosefs源代码分析

    一.分析MFS非常有用的资源 本来想写的,但是看到了CSDN上的资料就没这个心情了,非常详细的讲解分享给大家: CSDN中非常详细的文档:http://download.csdn.net/detail ...

  4. jquery:validate的例子

    该文档转载自 http://ideabean.javaeye.com/blog/363927 官方网站 http://bassistance.de/jquery-plugins/jquery-plug ...

  5. windows7配置Nginx+php+mysql教程

    windows7配置Nginx+php+mysql教程 最近在学习php,想把自己的学习经历记录下来,并写一些经验,仅供参考交流.此文适合那些刚刚接触php,想要学习并想要自己搭建Nginx+php+ ...

  6. 使用html2canvas实现浏览器截图

    最近做项目为了解决全局异常信息记录,研究了一下浏览器全屏截图功能,方便用户发现异常时能够快速截图发给管理员.最终记录的异常信息如下,上面的[截图报告管理员]就是使用html2canvas前端插件实现的 ...

  7. jquery版楼层滚动特效

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>楼 ...

  8. qingku

    # -*- coding:utf-8 -*- list1=[] list2=[] list3 = [] list4 = [] while True: inputs = raw_input(" ...

  9. hbase shell 常见命令

    quick start from official Hbase  hbase(main):003:0> create 'test', 'cf' 0 row(s) in 1.2200 second ...

  10. php-fpm中启用慢日志配置(用于检测执行较慢的PHP脚本)

    虽然通过nginx accesslog可以记录用户访问某个接口或者网页所消耗的时间,但是不能清晰地追踪到具体哪个位置或者说函数慢,所以通过php-fpm慢日志,slowlog设置可以让我们很好的看见哪 ...