.appendchild executing twice in CKeditor

问题

I'm using the simpleuploads plugin for CKeditor. Everything's working perfect except for one itsy bitsy problem.

I'm trying wrap an uploaded image object in a div like so

<div class="image-container>
   <img class="addedImg>
</div>

and have added the following at the bottom of /app/assets/javascripts/ckeditor/config.js

CKEDITOR.on('instanceReady', function(e) {
    e.editor.on( 'simpleuploads.finishedUpload' , function(ev)
    {
            var element = ev.data.element;
            if (element.getName() == 'img')
            {
                    var img = element.$,
                    doc = img.ownerDocument,
                    div = doc.createElement('div');
            img.setAttribute('class', 'addedImg');
            img.removeAttribute('width');
            img.removeAttribute('height');
            div.setAttribute('class', 'image-container');
                    img.parentNode.replaceChild(div, img);
            div.appendChild(img);
            }
    });
});

The problem is div is wrapped in another div like so:

<div class="image-container">
   <div class="image-container">
       <img class="addedImg">
   </div>
</div>

How do I get the script to execute only once?

EDIT: Issue caused by my custom assets/javascripts/ckeditor/config.js being loaded, and then the galetahub gem's assets/ckeditor/config.js being loaded again. Not sure where the problem lies. Will post more details if solution is found.

回答1:

The code is fine, but that file is being included twice so the listener is executed twice. The problem can be avoided by stopping the finishedUpload event after is being executed the first time:

CKEDITOR.on('instanceReady', function(e) {
    e.editor.on( 'simpleuploads.finishedUpload' , function(ev)
    {
            var element = ev.data.element;
            if (element.getName() == 'img')
            {
                    var img = element.$,
                    doc = img.ownerDocument,
                    div = doc.createElement('div');
            img.setAttribute('class', 'addedImg');
            img.removeAttribute('width');
            img.removeAttribute('height');
            div.setAttribute('class', 'image-container');
                    img.parentNode.replaceChild(div, img);
            div.appendChild(img);

                    ev.stop(); // Stop the event in case the listener is inserted twice
            }
    });
});

来源：https://stackoverflow.com/questions/23854455/appendchild-executing-twice-in-ckeditor

标签

javascript

ruby-on-rails

ckeditor