Изменить фон выбранного элемента, нажав

0

У меня вопрос: можно ли изменить цвет/фон элемента после нажатия на него?

Пусть есть простой пример: у нас есть две коробки:

<a href="#" id="box1"></a>
<a href="#" id="box2"></a>

и три ссылки с классами: красный, черный, синий. Можно ли сначала щелкнуть один из этих полей (чтобы выбрать/активировать их), а затем изменить цвет, щелкнув соответствующую ссылку (ту, что с классом)? когда я буду теперь, что в таком простом примере я предполагаю, что мне будет легче адаптировать его к графике SVG, на которой я хотел работать.

благодарю!

Теги:
svg
colors

2 ответа

1
Лучший ответ

Вы можете использовать jquery для достижения того же. Создал ссылку Plunker для вашей справки, если это то, что вы хотите.

  • 0
    спасибо, единственная проблема с этим кодом состоит в том, что после одного изменения цвета невозможно изменить его снова.
  • 1
    Хорошо, теперь посмотрите на обновленную ссылку Plunker .
1

Вы можете попробовать что-то вроде этого (предполагая jQuery, хотя это можно сделать и с помощью javascript).

Добавьте класс в каждое из своих полей:

<a href="#" id="box1" class="box">Box 1</a>

Затем добавьте прослушиватель событий, чтобы пометить поле как "выбранное", когда оно нажато.

$('.box').on('click', function() {
    $('.selected').removeClass('selected');
    $(this).addClass('selected');
});

Затем, если у вас есть цветная ссылка:

<a href="#" class="color-link" data-color="red">Red</a>

Вы можете поместить на него событие так:

$('.color-link').on('click', function() {
    $('.selected').css('background', $(this).data('color'));
});

Который должен изменить фон css окна с последним нажатием кнопки для вас.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню