百度ueditor 多个实例时图片缩放框错位bug修复

 今天发现同一个页面存在多个ueditoer编辑器时上传图片后点击图片会出现图片缩放框错位的问题 

   正常情况下如图, 图片四周会显示出缩放框

当有多个ueditor富文本编辑框都上传图片时点击图片会出现如下错位:

   

  图片缩放框出现了错位。

 仔细调试了 umeditor.js代码后发现在8888行代码出现了问题(版本:UEditor Mini版本  1.2.2)

 attachTo: function ($obj) {
            var me = this,
               imgPos = $obj.offset(),
               $root = me.root(),
               $wrap = me.defaultOpt.$wrap,
               posObj = $wrap.offset();
            posObj = $wrap.offset();
            me.data('$scaleTarget', $obj);
            me.root().css({
                position: 'absolute',
                width: $obj.width(),
                height: $obj.height(),
                left: imgPos.left - posObj.left - parseInt($wrap.css('border-left-width')) - parseInt($root.css('border-left-width')),
                top: imgPos.top - posObj.top - parseInt($wrap.css('border-top-width')) - parseInt($root.css('border-top-width'))
            });
        },

 问题出在这行代码  $wrap = me.defaultOpt.$wrap, =>me.defaultOpt.$wrap  按照代码逻辑应该是指向了当前要选中图片的的所属ueditor div对象,但是它实际上指向的不是当前图片所在的编辑器div对象,所以添加了几行判断代码解决了这个bug

 attachTo: function ($obj) {
        var me = this,
           imgPos = $obj.offset(),
           $root = me.root(),
           $wrap =null;
        //解决同一个页面有多个编辑器实例点击图片时候出现缩放框错位问题
        if (this._$el[0].parentElement != this.defaultOpt.$wrap[0]) {
            $wrap = $(this._$el[0].parentElement);
        }
        else {
            $wrap = me.defaultOpt.$wrap;
        }
        posObj = $wrap.offset();
        me.data('$scaleTarget', $obj);
        me.root().css({
            position: 'absolute',
            width: $obj.width(),
            height: $obj.height(),
            left: imgPos.left - posObj.left - parseInt($wrap.css('border-left-width')) - parseInt($root.css('border-left-width')),
            top: imgPos.top - posObj.top - parseInt($wrap.css('border-top-width')) - parseInt($root.css('border-top-width'))
        });
    },

 解决问题前查了查发现网上也有不少碰到这个问题的

 https://tieba.baidu.com/p/5724906598?red_tag=2417469440 

https://blog.csdn.net/qq_35405240/article/details/82786590  这个应该是没发现问题根本所在

 

 希望baidu工程师或者ueditoer 开源开发者可以修正这个bug 

版权声明:本文为Asa_Jim原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/Asa_Jim/article/details/88743949