Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 23.11.2016, 23:03
Новичок на форуме
Отправить личное сообщение для DeminEvgen Посмотреть профиль Найти все сообщения от DeminEvgen
 
Регистрация: 23.11.2016
Сообщений: 1

Добавление класса к ссылке
Вообщем есть вот такой простой скрипт
Код:
jQuery(function($) {   
    $(document).ready(function() {
        $("a.show-block").click(function() {
            if ( $( "#sp-top-bar,#sp-section-1" ).is( ":hidden" ) ) {
                $( "#sp-top-bar,#sp-section-1" ).slideDown( "slow" );
              } else {
                $( "#sp-top-bar,#sp-section-1" ).slideUp();
              }
        });
    });
});
Работает отлично, прячет блок, и наоборот.
Вообщем хотелось бы для "a.show-block" добавить классы:class1, class2 в зависимости от состояния блока. Ну то есть, блок открыт - class1, блок скрыт - class2.
Пытался сделать что то вроде этого:
Код:
jQuery(function($) {   
    $(document).ready(function() {
        $("a.show-block").click(function() {
            if ( $( "#sp-top-bar,#sp-section-1" ).is( ":hidden" ) ) {
                $("a.show-block").addClass("test1")
                $( "#sp-top-bar,#sp-section-1" ).slideDown( "slow" );
              } else {
                $("a.show-block").addClass("test2")
                $( "#sp-top-bar,#sp-section-1" ).slideUp();
              }
        });
    });
});
Но классы применяются сразу оба.
Не подскажете как мне это реализовать?
Там removeClass нужно использовать?
Сделал так:
Код:
jQuery(function ($) {
    $(document).ready(function () {
        $("a.show-block").click(function () {
            if ($("#sp-top-bar,#sp-section-1").is(":hidden")) {
                $("a.show-block").removeClass("class2")
                $("a.show-block").addClass("class1")
                $("#sp-top-bar,#sp-section-1").slideDown("slow");
            }
            else {
                $("a.show-block").addClass("class2")
                $("a.show-block").removeClass("class1")
                $("#sp-top-bar,#sp-section-1").slideUp();
            }
        });
    });
});
ну и самой ссылки задал начальный class1
Теперь классы при нажатии чередуются.
Но мне кажется, что это всё очень криво))) Подскажите правильно ли я сделал?

Последний раз редактировалось DeminEvgen, 23.11.2016 в 23:29.
Ответить с цитированием
  #2 (permalink)  
Старый 24.11.2016, 00:28
Аватар для dd_smol
Кандидат Javascript-наук
Отправить личное сообщение для dd_smol Посмотреть профиль Найти все сообщения от dd_smol
 
Регистрация: 08.03.2015
Сообщений: 131

jQuery(function($) {
    $('a.show-block')
        .addClass('class1')
        .click(function (e) {
            $('#sp-top-bar,#sp-section-1').slideToggle('show');
            $( e.target ).toggleClass('class1 class2');
        });
});
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Добавление класса всем родительским элементам списка Torawhite Элементы интерфейса 0 01.05.2015 22:06
Не работает код Javascript на присвоение класса ссылке osya90 Общие вопросы Javascript 6 11.01.2015 18:59
добавление нового класса тегу по id narKotik Элементы интерфейса 6 25.12.2014 14:18
Добавление класса к активной ссылке joylord Элементы интерфейса 6 28.09.2013 18:17
Добавление класса или id к ссылке. Простой вопрос: Как? Mrjoey Элементы интерфейса 1 18.05.2011 16:42