拖拽对DOM的影响

Posted 2020-06-19 SINGLE DOG

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

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