#javascript #jquery #html #ckeditor #jquery-ui-dialog
#javascript #jquery #HTML #ckeditor #jquery-ui-dialog
Вопрос:
Я застрял с этой ошибкой в течение нескольких часов, но до сих пор не нашел никаких подсказок для ее исправления:
Я пытаюсь динамически создавать диалоги после нажатия кнопки, а затем прикрепить к нему ckeditor. Он работал нормально, когда я имел дело только с одним экземпляром, но после того, как я включил несколько экземпляров CKEditor (привязанных к разным диалоговым элементам на основе div, эти функции базового редактирования теряются…Вот соответствующий HTML-код, прежде чем я закрою / перетащу другие элементы (извините, что не могу загрузить изображение из-за отсутствия репутации в stackoverflow) :
<iframe src="" frameborder="0" class="cke_wysiwyg_frame cke_reset" title="Rich Text Editor, wb_editor_7" aria-describedby="cke_467" tabindex="0" allowtransparency="true" style="width: 100%; height: 100%;"></iframe>
<html dir="ltr" lang="en"><head><title data-cke-title="Rich Text Editor, wb_editor_7">Rich Text Editor, wb_editor_7</title><style data-cke-temp="1">html{cursor:text;*cursor:auto}
img,input,textarea{cursor:default}</style><link type="text/css" rel="stylesheet" href="http://127.0.0.1:8001/static/dashboard/lib/ckeditor-4.4.1/contents.css?t=E4KA"><style data-cke-temp="1">.cke_editable{cursor:text}.cke_editable img,.cke_editable input,.cke_editable textarea{cursor:default} .cke_contents_ltr a.cke_anchor,.cke_contents_ltr a.cke_anchor_empty,.cke_editable.cke_contents_ltr a[name],.cke_editable.cke_contents_ltr a[data-cke-saved-name]{background:url(http://127.0.0.1:8001/static/dashboard/lib/ckeditor-4.4.1/plugins/link/images/anchor.png?t=E4KA) no-repeat left center;border:1px dotted #00f;background-size:16px;padding-left:18px;cursor:auto;}.cke_contents_ltr img.cke_anchor{background:url(http://127.0.0.1:8001/static/dashboard/lib/ckeditor-4.4.1/plugins/link/images/anchor.png?t=E4KA) no-repeat left center;border:1px dotted #00f;background-size:16px;width:16px;min-height:15px;height:1.15em;vertical-align:text-bottom;}.cke_contents_rtl a.cke_anchor,.cke_contents_rtl a.cke_anchor_empty,.cke_editable.cke_contents_rtl a[name],.cke_editable.cke_contents_rtl a[data-cke-saved-name]{background:url(http://127.0.0.1:8001/static/dashboard/lib/ckeditor-4.4.1/plugins/link/images/anchor.png?t=E4KA) no-repeat right center;border:1px dotted #00f;background-size:16px;padding-right:18px;cursor:auto;}.cke_contents_rtl img.cke_anchor{background:url(http://127.0.0.1:8001/static/dashboard/lib/ckeditor-4.4.1/plugins/link/images/anchor.png?t=E4KA) no-repeat right center;border:1px dotted #00f;background-size:16px;width:16px;min-height:15px;height:1.15em;vertical-align:text-bottom;}
.cke_show_borders table.cke_show_border,.cke_show_borders table.cke_show_border > tr > td, .cke_show_borders table.cke_show_border > tr > th,.cke_show_borders table.cke_show_border > tbody > tr > td, .cke_show_borders table.cke_show_border > tbody > tr > th,.cke_show_borders table.cke_show_border > thead > tr > td, .cke_show_borders table.cke_show_border > thead > tr > th,.cke_show_borders table.cke_show_border > tfoot > tr > td, .cke_show_borders table.cke_show_border > tfoot > tr > th{border : #d3d3d3 1px dotted}</style></head><body contenteditable="true" class="cke_editable cke_editable_themed cke_contents_ltr cke_show_borders" spellcheck="false">Hello world! Thank you for your help!</body></html>
После создания другого диалогового окна, поддерживаемого ckeditor, он не смог разрешить пользователям вводить и редактировать вначале, но как только я перетащу вновь созданный, он будет недоступен для редактирования:
<iframe src="" frameborder="0" class="cke_wysiwyg_frame cke_reset" title="Rich Text Editor, wb_editor_4" aria-describedby="cke_389" tabindex="0" allowtransparency="true" style="width: 100%; height: 100%;"></iframe><html><head></head><body></body></html>
Обратите внимание, что разница очень удивительна в том, что атрибут «contenteditable = true» исчез в HTML в CKEDITOR.
Я попытался сделать текстовую область, используемую для замены самим CKEDITOR, доступной для редактирования, но все равно не будет работать. Заранее спасибо!
Ответ №1:
Я нашел ответ: это из-за версии jquery ui, которая должна быть версии 1.9, чтобы разрешить управление z-индексом, чтобы iframe можно было поместить впереди.