Как автоматически помещать символы contenteditable div в дочерний?

Question

[GennadyPHP]

Есть блок "поле ввода"

<div class="contentBlock contenteditable" contenteditable="true" placeholder="Type some text" spellcheck="true"><p></p></div>

Как сделать так, чтобы весь вводимый текст в этот блок помещался в <p></p>? Так делается на многих других сайтах, но весь js там, как правило, обфусцирован и решения найти не представляется возможным. Спасибо)

Comments

[Vladimir]

Вы имеете ввиду теги ?

[Павел Корнилов]

Или bb-коды?

[GennadyPHP]

Vladimir, да, в блоке есть тег "p", в него надо пихать текст, который человек пишет в родительский блок с contenteditable="true". Я написал в квадратных скобках, потому что тостер реплейсит теги

[GennadyPHP]

KorniloFF, отредактировал ту часть с вопросом

[Vladimir]

GennadyPHP, а вводить нужно именно в div'е и где должен появиться вводимый текст, обрамлённый тегами ?

[GennadyPHP]

Vladimir, ввод происходит в блок с contenteditable="true". В нем, в этом блоке, есть теги <p></p> и как только вы вводите текст в блок, он "пихается" в вышеуказанный тег, который лежит в нем

[GennadyPHP]

Vladimir,

<div contenteditable="true" placeholder="здесь надо писать">
Здесь это пишется по умолчанию
<p>А сюда надо пихать</p>
</div>

[Vladimir]

GennadyPHP, с input'ом знаю как сделать, а вот с div'ом... Сейчас конечно попробую костыль собрать.

[Павел Корнилов]

GennadyPHP, так contenteditable и так при каждом enter создаёт отдельный параграф <p><br></p>

[GennadyPHP]

KorniloFF, нет, он пишет текст без тега

[Павел Корнилов]

Ну, я делал редактор контента на contenteditable. У меня прекрасно вставляются параграфы без доп. скриптов.

[GennadyPHP]

KorniloFF, он создает для каждой линии div. Мне надо, чтобы он писал все в один, уже созданный p

[Vladimir]

GennadyPHP, ух ты, работает ;)

<div class = "container" contenteditable>Edit me</div>
<div class = "withP"></div>
<script src = "100.js"></script>

document.getElementsByClassName('container')[0].oninput = function ()
{
	document.getElementsByClassName('withP')[0].innerHTML = '<p>' + document.getElementsByClassName('container')[0].innerHTML + '</p>';
}

даже ctrl+B/I берёть ;)

[Павел Корнилов]

Демка, где через админку можно редактировать контент. Авторизируйтесь по указанным реквизитам, а потом можете попробовать поредактировать здесь