Код, изменяющий оформление элементов, срабатывает только один раз. Почему?

Question

[Annalana]

Здравствуйте!
Написала код, который, по идее, должен присваивать новые id элементам. Для этих id в CSS написан измененный дизайн.
Цель: скрипт по клику на элементе должен менять его дизайн и дизайн других элементов. При повторном клике менять все на то, что было, удаляя id.
Код запускается, но срабатывает только один раз. При повторении этих операций не происходит ничего.

Сам код. Я уже в него и цикл добавила, но работать иначе он от этого не стал... Один раз по прежнему срабатывает так, как нужно.

<script type="text/javascript" id="1">
    var n=0;
    while(n < 3){
    $(".building1").click(function(){
      $(".invisible-container").attr("id", "delta-invisible-container");
      $(".header-menu").attr("id", "delta-header-menu");
      $(".building2").attr("id", "delta-building2");
      $(this).attr("id", "delta-building1");
      $(".building1 p").attr("id", "delta-building1-p");
      $(".building1").click(function(){
        $(".invisible-container").removeAttr("id");
        $(".header-menu").removeAttr("id");
        $(".building2").removeAttr("id");
        $(this).removeAttr("id");
        $(".building1 p").removeAttr("id");
 });
});
n++;
};
 </script>

Подскажите, что с ним не так:) Заранее спасибо!

Comments

[Rustam Bainazarov]

Клик в клике. Делайте проверку по наличию ID у .building1, например. Если нет ID, то всё из первой части, если есть ID, то всё из второй части.

[alex-1917]

консоль наверняка что-то пишет
навскидку - вы в цикле пристегиваете ID, т.е. будут одинаковые ID

[Annalana]

Рустам Байназаров, @alex-1917
Простите, не совсем поняла: клик в клике работает. Не работает весь скрипт целиком во второй раз. А сам скрипт, что с циклом, что нет, работает полностью, туда-обратно. Значит, id и присваиваются, и удаляются, правильно?

[Rustam Bainazarov]

Annalana, клик в клике без условий. Второй клик у вас типа удалять должен, но проверки нет. И так неправильно в целом. Как должно быть второй клик внутри клика?

Дайте, кстати, HTML-код для проверки, а то я с телефона. Сейчас пришлю, что вам нужно.

[alex-1917]

Рустам Байназаров,

Клик в клике

ахаха, и правда.
я вот не увидел.
обожаю людей, которые досконально изучают вопрос, хотя бы даже и такой, как вот этот текущий
невнятный громоздкий слепленный наспех полувопрос-полупоиск своего я.

Answer 1

[Rustam Bainazarov]

Упрощать ваш код с телефона нет желания, но это будет работать.

Comments

[Annalana]

Большое спасибо! Код заработал.
Не совсем поняла, как и почему, но похоже, мне не хватает теории, буду гуглить.

[Rustam Bainazarov]

Annalana, именно так.

Посмотрите ответ like-a-boss, там то же самое, просто в сокращённом виде.

Answer 2

[Пашенька]

var el1 = $('.lol1'),
		el2 = $('.lol2');

$('.building1').on('click', function(event) {
	$(el1).attr('id') ? $(el1).removeAttr('id') : $(el1).attr('id', 'lol1');
	$(el2).attr('id') ? $(el2).removeAttr('id') : $(el2).attr('id', 'lol2');
	// etc.
});

Comments

[Annalana]

Работает!
Большое спасибо! Буду разбираться=)

[Пашенька]

Annalana, пожалуйcта, можете даже здесь спросить, что непонятно) Но я чуть руки не сломал, по правде, писав на этом вашем jQuery :)

[Annalana]

like-a-boss,
Дело в том, что пока мне непонятно все - учу первый день:) Но потом, когда вопросы станут конкретными, спрошу обязательно. Значит, возможно, стоит выбрать для начала другую библиотеку...?

[Пашенька]

Annalana, неплохо для первого дня :) В первый день я был хуже. Ну смотрите в чем дело: jQuery хорош для более быстрого старта: а) на нем проще начать б) он неимоверно популярен - значит легко нагуглить проблему. Я не имел ввиду другую библиотеку, тут как раз, если брать библиотеку, то как раз jQuery - первый кандидат. Я имел ввиду то, что помимо библиотек можно писать и на чистом JavaScript и мой код вышел был короче, кстати. Начинать можете и с jQuery, но потом, когда получите некоторый опыт и понимание происходящего, то загляните, к примеру на learn.javascript.ru и копните чистый язык JS.

[Пашенька]

Annalana, и кстати, обратите внимание, что я использовал метод .on, .click и многие другие методы, считаются устаревшими и все обработчики принято вешать через .on

[Annalana]

like-a-boss, с чистым JS тоже хочу разобраться, но хотелось, чтобы заработало хоть что-то для начала. Стоит, видимо, читать сразу про все=)
Спасибо за сайт: учебник - это именно то, что надо, а то я пока все по справочникам...

[Пашенька]

Annalana, Изучайте (: