Действия с DIV2 и DIV1 при onclick на DIV1
есть DIV1 - кнопка и DIV2 - блок, который надо показывать/скрывать + надо менять классы vk_comments_inactive, vk_comments_active для смены изображения кнопки
черновой код DIV1 onclick следующий: <div id="vk_chat_button" class="vk_comments_inactive" onclick="toggle_visibility('vk_comments_wrap');$(this).removeClass('vk_comments_inactive').addClass('vk_comments_active');" >chat</div> работающая функция, которая прячет/показывает DIV2, здесь все в порядке: function toggle_visibility(id) { var e = document.getElementById(id); if(e.style.display == 'block') e.style.display = 'none'; else e.style.display = 'block'; } помогите в этот код правильно прописать смену классов vk_comments_inactive, vk_comments_active по toggle для DIV1, опять к ночь, опять начинаю тупить, не хватает примеров и ничего не получается. |
нашел пример для второй части, со сменой классов
http://jsfiddle.net/toddmotto/6UwF3/ получилось так <div id="vk_chat_button" class="vk_comments_inactive" onclick="toggle_visibility('vk_comments_wrap'); $(this).toggleClass(this, 'vk_comments_active');" ></div> function toggle_visibility(id) { var e = document.getElementById(id); if(e.style.display == 'block') e.style.display = 'none'; else e.style.display = 'block'; } function toggleClass(elem, className) { var newClass = ' ' + elem.className.replace( /[\t\r\n]/g, " " ) + ' '; if (hasClass(elem, className)) { while (newClass.indexOf(" " + className + " ") >= 0 ) { newClass = newClass.replace( " " + className + " " , " " ); } elem.className = newClass.replace(/^\s+|\s+$/g, ''); } else { elem.className += ' ' + className; } } но, все равно не работает, постоянно меняет на неактивный класс. помогите победить этот код. |
$(this) - это jQuery, .toggleClass() - ее метод изменяющий класс/классы, и синтаксис его такой.
Вы же по методу пытаетесь вызвать функцию, которая совсем не нужна. Подключили jQuery, значит используйте, выбросив и вот это onclick="toggle_visibility('vk_comments_wrap');. |
нет, jquery не получится использовать, он подключается позже.
потому все функции и сделаны в javascript. с jquery все было бы проще для меня. пробовал onclick="toggle_visibility('vk_comments_wrap'); toggleClass(this, 'vk_comments_active');" так тоже не работает. |
laimas, спасибо, натолкнули на решение.
onclick="toggle_visibility('vk_comments_wrap'); toggleClass(this);" function toggle_visibility(id) { var e = document.getElementById(id); if(e.style.display == 'block') e.style.display = 'none'; else e.style.display = 'block'; } function toggleClass(div){ var className=div.getAttribute("class") if(className=="vk_comments_active"){ div.className="vk_comments_inactive" } else{ div.className="vk_comments_active" } } вот так вроде получилось |
Часовой пояс GMT +3, время: 11:22. |