вопрос
Пытаюсь через js onclick вывести форму добавления комментария, но попытка скопировать форму оказалось провальной. Когда копирую форму, в месте, где появляется #document подгружается другой и затирает мой. В итоге форма добавления неактивна. Как исправить данную проблему? Заранее, извиняюсь за длинный код.
function SomeFunction() {
var test ="<form method='post' name='form2' id='form2'> <div class='wrp'>\n" +
"<h4 class='ltrabold'>Добавить комментарий</h4>\n" +
"<div class='grid_3_4'>\n" +
"<ul class='ui-form'>\n" +
"<li id='comment-editor'><script type='text/javascript'>\n" +
"var text_upload = 'Загрузка файлов и изображений на сервер';\n" +
"<\/script>\n" +
"<div id='mceu_17' class='mce-tinymce mce-container mce-panel' hidefocus='1' tabindex='-1' role='application' style='visibility: hidden; border-width: 1px; width: 100%;'><div id='mceu_17-body' class='mce-container-body mce-stack-layout'><div id='mceu_18' class='mce-toolbar-grp mce-container mce-panel mce-stack-layout-item mce-first' hidefocus='1' tabindex='-1' role='group'><div id='mceu_18-body' class='mce-container-body mce-stack-layout'><div id='mceu_19' class='mce-container mce-toolbar mce-stack-layout-item mce-first mce-last' role='toolbar'><div id='mceu_19-body' class='mce-container-body mce-flow-layout'><div id='mceu_20' class='mce-container mce-flow-layout-item mce-first mce-btn-group' role='group'><div id='mceu_20-body'><div id='mceu_0' class='mce-widget mce-btn mce-btn-small mce-first' tabindex='-1' aria-labelledby='mceu_0' role='button' aria-label='Bold'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-bold'></i></button></div><div id='mceu_1' class='mce-widget mce-btn mce-btn-small' tabindex='-1' aria-labelledby='mceu_1' role='button' aria-label='Italic'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-italic'></i></button></div><div id='mceu_2' class='mce-widget mce-btn mce-btn-small' tabindex='-1' aria-labelledby='mceu_2' role='button' aria-label='Underline'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-underline'></i></button></div><div id='mceu_3' class='mce-widget mce-btn mce-btn-small mce-last' tabindex='-1' aria-labelledby='mceu_3' role='button' aria-label='Strikethrough'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-strikethrough'></i></button></div></div></div><div id='mceu_21' class='mce-container mce-flow-layout-item mce-btn-group' role='group'><div id='mceu_21-body'><div id='mceu_4' class='mce-widget mce-btn mce-btn-small mce-first' tabindex='-1' aria-labelledby='mceu_4' role='button' aria-label='Align left'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-alignleft'></i></button></div><div id='mceu_5' class='mce-widget mce-btn mce-btn-small' tabindex='-1' aria-labelledby='mceu_5' role='button' aria-label='Align center'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-aligncenter'></i></button></div><div id='mceu_6' class='mce-widget mce-btn mce-btn-small' tabindex='-1' aria-labelledby='mceu_6' role='button' aria-label='Align right'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-alignright'></i></button></div><div id='mceu_7' class='mce-widget mce-btn mce-btn-small mce-last' tabindex='-1' aria-labelledby='mceu_7' role='button' aria-label='Justify'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-alignjustify'></i></button></div></div></div><div id='mceu_22' class='mce-container mce-flow-layout-item mce-btn-group' role='group'><div id='mceu_22-body'><div id='mceu_8' class='mce-widget mce-btn mce-btn-small mce-first' tabindex='-1' aria-labelledby='mceu_8' role='button' aria-label='Insert/edit link'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-link'></i></button></div><div id='mceu_9' class='mce-widget mce-btn mce-btn-small mce-last' tabindex='-1' aria-labelledby='mceu_9' role='button' aria-label='Insert protected link'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-dleicon icon-leech'></i></button></div></div></div><div id='mceu_23' class='mce-container mce-flow-layout-item mce-btn-group' role='group'><div id='mceu_23-body'><div id='mceu_10' class='mce-widget mce-btn mce-btn-small mce-first' tabindex='-1' aria-labelledby='mceu_10' role='button' aria-label='Insert/edit image'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-image'></i></button></div><div id='mceu_11' class='mce-widget mce-btn mce-btn-small' tabindex='-1' aria-labelledby='mceu_11' role='button' aria-label='Uploading files'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-dleicon icon-up'></i></button></div><div id='mceu_12' class='mce-widget mce-btn mce-btn-small mce-last' tabindex='-1' aria-labelledby='mceu_12' role='button' aria-label='Add emoticons'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-emoticons'></i></button></div></div></div><div id='mceu_24' class='mce-container mce-flow-layout-item mce-btn-group' role='group'><div id='mceu_24-body'><div id='mceu_13' class='mce-widget mce-btn mce-btn-small mce-first' tabindex='-1' aria-labelledby='mceu_13' role='button' aria-label='Bullet list'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-bullist'></i></button></div><div id='mceu_14' class='mce-widget mce-btn mce-btn-small mce-last' tabindex='-1' aria-labelledby='mceu_14' role='button' aria-label='Numbered list'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-numlist'></i></button></div></div></div><div id='mceu_25' class='mce-container mce-flow-layout-item mce-last mce-btn-group' role='group'><div id='mceu_25-body'><div id='mceu_15' class='mce-widget mce-btn mce-btn-small mce-first' tabindex='-1' aria-labelledby='mceu_15' role='button' aria-label='Insert quote'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-dleicon icon-quote'></i></button></div><div id='mceu_16' class='mce-widget mce-btn mce-btn-small mce-last' tabindex='-1' aria-labelledby='mceu_16' role='button' aria-label='Insert hidden text'><button role='presentation' type='button' tabindex='-1'><i class='mce-ico mce-i-dleicon icon-hide'></i></button></div></div></div></div></div></div></div><div id='mceu_26' class='mce-edit-area mce-container mce-panel mce-stack-layout-item mce-last' hidefocus='1' tabindex='-1' role='group' style='border-width: 1px 0px 0px;'><iframe id='comments_ifr' frameborder='0' allowtransparency='true' title='Текстовое поле. Нажмите ALT-F9 чтобы вызвать меню, ALT-F10 панель инструментов, ALT-0 для вызова помощи.' src='javascript:''' style='width: 100%; height: 220px; display: block;'>\n"+
//В этом месте потом затирается весь блок до:
"<html><head><style id='mceDefaultStyles' type='text/css'>.mce-content-body div.mce-resizehandle {position: absolute;border: 1px solid black;box-sizing: box-sizing;background: #FFF;width: 7px;height: 7px;z-index: 10000}.mce-content-body .mce-resizehandle:hover {background: #000}.mce-content-body img[data-mce-selected],.mce-content-body hr[data-mce-selected] {outline: 1px solid black;resize: none}.mce-content-body .mce-clonedresizable {position: absolute;outline: 1px dashed black;opacity: .5;filter: alpha(opacity=50);z-index: 10000}.mce-content-body .mce-resize-helper {background: #555;background: rgba(0,0,0,0.75);border-radius: 3px;border: 1px;color: white;display: none;font-family: sans-serif;font-size: 12px;white-space: nowrap;line-height: 14px;margin: 5px 10px;padding: 5px;position: absolute;z-index: 10001}\n"+
".mce-visual-caret {position: absolute;background-color: black;background-color: currentcolor;}.mce-visual-caret-hidden {display: none;}*[data-mce-caret] {position: absolute;left: -1000px;right: auto;top: 0;margin: 0;padding: 0;}\n"+
".mce-content-body .mce-offscreen-selection {position: absolute;left: -9999999999px;width: 100px;height: 100px;}.mce-content-body *[contentEditable=false] {cursor: default;}.mce-content-body *[contentEditable=true] {cursor: text;}\n"+
"</style><meta http-equiv='Content-Type' content='text/html; charset=UTF-8'><link type='text/css' rel='stylesheet' href='http://my-site.ru/engine/editor/jscripts/tiny_mce/skins/lightgray/content.min.css'><link type='text/css' rel='stylesheet' href='http://my-site.ru/engine/editor/css/content.css'></head><body id='tinymce' class='mce-content-body ' data-id='comments' contenteditable='true' spellcheck='false'><p><br data-mce-bogus='1'></p></body></html>\n"+
//Этого конца)
"</iframe></div></div></div><textarea id='comments' name='comments' rows='10' cols='50' aria-hidden='true' style='display: none;'></textarea></li>\n"+
"</ul>\n"+
"<div class='form_submit'>\n"+
"<button class='btn' type='submit' name='submit' title='Отправить комментарий'><b class='ultrabold2'>Отправить комментарий</b></button>\n"+
"</div>\n"+
"</div>\n"+
"</div>\n"+
"<div id='inputs'><input type='hidden' name='subaction' value='addcomment'><input type='hidden' name='name' id='name' value='iam'><input type='hidden' name='mail' id='mail' value=''>\n"+
"<input type='hidden' name='post_id' id='post_id' value='247'></div>\n"+
"</form>";
$('.КудаГрузим').html(test);
}}
}
Ответил: dmfranklin
Проблема решена, в место, где нужна форма написать textarea с id и добавить ему соответствующий джаваскрит tinymce.init со своими параметрами, указав в селекторе id textarea.