Обновление CKEditor с помощью setData оставляет img тег без src

Question

Я использую jquery для изменения разметки в экземпляре CKEditor. В частности, я разрешаю кому-то выбирать логотип из списка выбора в моей форме, а затем обновлять логотип в ckeditor по своему выбору.

Проблема в том, что логотип отображается как неработающая ссылка. Если я проверю источник ckeditor, это правильно, и если я щелкнул правой кнопкой мыши изображение и выберите «Свойства изображения», он будет правильно отображаться в диалоговом окне img, и если я тогда ОК, то в диалоговом окне изображение появится в предварительном просмотре правильно.

Если я использую Firebug для проверки самого тега img на странице, ckeditor поместил src в два тега данных, data-cke-565-src (это имя, похоже, изменилось) и data-cke-saved-src , Но у img больше нет свойства src. Когда я использую окно «Свойства изображения», чтобы изображение правильно отображалось в редакторе, свойство src вернулось.

Я использую GetData и УстановитьДанный изменить содержание:

var emailSupport = { 
editorName: 'HtmlBody', 
getBodyText: function() { 
    return CKEDITOR.instances[emailSupport.editorName].getData(); 
}, 

$getBodyText: function() { 
    return $("<div>" + emailSupport.getBodyText() + "</div>"); 
}, 

setBodyText: function (h) { 
    CKEDITOR.instances[emailSupport.editorName].setData(h instanceof jQuery ? h.html() : h); 
    return h instanceof jQuery ? h : $("<div>" + h + "</div>"); 
}, 
refreshLogo: function (n, $h) { 
    if (typeof $h === "undefined") $h = emailSupport.$getBodyText(); 
    var $emailLogo = $h.find("img.emailLogo"); 
    var $img = $("#" + n).clone().attr("id", null); 
    if ($img.length > 0) 
     $emailLogo.show().replaceWith($img.addClass("emailLogo")); 
    else { 
     $emailLogo.fadeOut(); 
     alert('Could not find selected image'); 
    } 
    emailSupport.setBodyText($h); 
} 
}; 

Это подмножество JavaScript, я использую, но должна быть уместен материалом. Логотипы сами находятся в DOM страницы, но скрыты, поэтому я могу захватить их на основе GUID и заменить логотип-листы img копией самого изображения.

Я, вероятно, дал вам больше кода, чем мне нужно, потому что отладка setBodyText показывает, что правильный HTML передается в setData, поэтому кажется ясным, что ckeditor отключает свойство src.

Мне кажется, что это ошибка, но я подумал, не испытал ли кто-нибудь это раньше или не работал. Я пытаюсь избежать необходимости вручную изменять DOM после вызова setData, ища любые теги img без свойства src и копировать его из свойства data-cke-saved-src, но это единственное обходное решение, которое я могу придумать прямо сейчас.

Как обновление, при написании этого, я попробовал его с несколькими альтернативными файлами, и иногда он отлично работает. Это согласуется с именем файла, работающим для одного файла, а не для другого, но я не понял, какая разница между рабочим и сломанным изображением!

Путь к файлам все виртуальные, но от корня: все они начинаются /, например:

<img width="160" data-cke-862-src="/Content/Logos/thumbs/w160_505_Logo.jpg.png" data-cke-saved-src="/Content/Logos/thumbs/w160_505_Logo.jpg.png" class="imagingThumb emailLogo" alt="505_Logo.jpg" /> 

Answer 1

Без всякого намека на «правильного» решения, я просто должен был катить это сам, в несколько грязный способ.

Это моя замена функция setBodyText сверху:

setBodyText: function (h) { 
    CKEDITOR.instances[emailSupport.editorName].setData(h instanceof jQuery ? h.html() : h, function() { 
     // There seems to be a bug in CKEditor which is stripping out the logos/images when set 
     // This callback code puts it back 
     $("#cke_" + emailSupport.editorName + " iframe").contents().find("img").each(function() { 
      var $img = $(this); 
      if ($img.prop("src") == "") { 
       $img.prop("src", $img.data("cke-saved-src")); 
      } 
     }); 
    }); 
    return h instanceof jQuery ? h : $("<div>" + h + "</div>"); 
}, 

хранить имя редактора, так что я могу использовать, чтобы найти элемент на странице, который держит IFRAME редактора, и затем найдите любое изображение, проверьте наличие пустого src и верните его снова.

Я не знаю, почему ckeditor делает это (иногда), но это фиксирует вещи.