Тема: Самописный спойлер работает не так как надо
Решил сделать свой спойлер, т.к. существующие расширения со спойлерами у меня почему-то не работают...
Вроде всё сделал, кнопку добавления через bb сделал, обработку, скрытие и показ сделал, но возникла проблема:
Все блоки (цитаты, код и тд) в спойлер не попадают, вылезают за него и всё.
Код обработки следующий:
mes = document.getElementsByClassName('entry-content'); //Формируем массив сообщений
for (i=0; i<mes.length; i++)
{
meshtml = mes[i].innerHTML; //Читаем сообщение
meshtml = meshtml.replace(/\[spoiler\]([\S\s]*?)\[\/spoiler\]/gim,'<spoiler>$1</spoiler>'); //Заменяем бб на теги
mes[i].innerHTML = meshtml; //Вставляем обратно
}Т.е. тут мы просто во всех сообщениях заменяем это: [spoiler]...[/spoiler] на это: <spoiler>...</spoiler>.
Далее:
sp = document.getElementsByTagName('spoiler'); //Формируем массив спойлеров
for (j=0; j<sp.length; j++)
{
sp_title = document.createElement('span'); //Создаём кнопку скрытия спойлера
sp_title.className = 'spoiler_title';
sp_title.innerHTML = 'Спойлер (Скрыть/Показать)'+'<br />';
sp_title.setAttribute('onClick','hidesp('+j+')'); //Добавляем событие клика
sp[j].parentNode.insertBefore(sp_title,sp[j]); //Вставляем перед спойлером
sp[j].className = 'spoiler';
sp[j].id = 'spoiler_'+j;
sp[j].style.display = 'none';
}Тут мы скрываем спойлер, присваиваем ему стиль, создаём ещё один блок (кнопку) перед ним. В спойлер заносим id вида spoiler_#, в кнопку заносим вызов функции, аргументом которой является индекс # своего спойлера.
Далее сама функция скрытия открытия:
function hidesp(index) { //Функция скрытия и расскрытия спойлеров
bl = document.getElementById('spoiler_'+index);
if (bl.style.display == 'block')
{
bl.style.display = 'none';
} else
{
bl.style.display = 'block';
}
}Теперь если написать [spoiler] [-code]...[-/code] [/spoiler], то после обработки получим <spoiler><code>...</code></spoiler>, а в DOM дереве <spoiler>...</spoiler><code>...</code>.
В чём может быть проблема?
Добавлено спустя 44 минуты 21 секунду:
А если вместо <spoiler>...</spoiler> делать <div>...</div> то всё нормально
