Форум программистов, компьютерный форум, киберфорум
jQuery
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.58/76: Рейтинг темы: голосов - 76, средняя оценка - 4.58
 Аватар для Shoshona
30 / 30 / 37
Регистрация: 03.06.2014
Сообщений: 1,055

Изменение цвета при клике и обратно

28.03.2017, 15:11. Показов 15380. Ответов 15
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
подскажите простенький код.
пробую
JavaScript
1
2
3
4
5
 $(".wpfp-link").on("click", function() {
        $(".fa-heart").css('color') === '#f71e1e' ? 
        $(".fa-heart").css('color', '#333333') : 
        $(".fa-heart").css('color', '#f71e1e');
    });
не получаеться
0
Лучшие ответы (1)
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
28.03.2017, 15:11
Ответы с готовыми решениями:

Изменение цвета при клике на чекбокс
доброго времени суток всем! такая ситуация: на странице список с таблицами и в каждой форма с одним чекбоксом, и когда мы кликаем по...

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

Изменение цвета кнопки при клике
как сделать чтоб кнопка меняла цвет при нажатии на неё?

15
 Аватар для Уф
890 / 725 / 447
Регистрация: 13.07.2015
Сообщений: 2,277
28.03.2017, 15:23
тернарный оператор возвращает значение, а не выполняет команды
JavaScript
1
 $(".fa-heart").css('color', $(".fa-heart").css('color') === '#f71e1e' ? '#333333' : '#f71e1e');
0
 Аватар для Shoshona
30 / 30 / 37
Регистрация: 03.06.2014
Сообщений: 1,055
28.03.2017, 17:27  [ТС]
Уф, Спасибо...
Я знаю что не по правилам, но не могли бы вы еще помочь
JavaScript
1
2
3
4
5
6
7
  $(document).ready(function(){
$(".wpfp-link").on("click", function() {
 if($(".wpfp-link").attr("title")=="Добавить в избранное") $(".fa-heart").css({color : "#f71e1e"});
            else 
        $(".fa-heart").css({color : "#333333"});
    });
  });
почему-то не работает этот скрипт, вернее красный цвет он включает, и все потом сколько не нажимай ничего не меняет. Как это исправить?

Добавлено через 2 минуты
Уф, P.S. скрипт после объекта стоит

Добавлено через 1 час 47 минут
Блин, я уже все перепробовал - ничего не получаеться(
0
 Аватар для fanatikus
1932 / 1523 / 703
Регистрация: 17.11.2012
Сообщений: 6,585
28.03.2017, 20:31
я не очень понял, что вам нужно.
PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
    <script type="text/javascript">
        $(document).ready(function () {
            $(".wpfp-link").on("click", function (e) { 
                e.preventDefault();
                if ($(this).attr("title") === "Добавить в избранное") {
                    $(".fa-heart").css({color: "#FF3300"});
                } else {
                    $(".fa-heart").css({color: "#00FF66"});
                }
            });
        });
    </script>
 
    <p class="fa-heart">test</p>
    <a class="wpfp-link" href="" title="Добавить в избранное">изменить цвет</a>
этот код работает
0
 Аватар для Shoshona
30 / 30 / 37
Регистрация: 03.06.2014
Сообщений: 1,055
29.03.2017, 09:11  [ТС]
fanatikus, при клике на
HTML5
1
<a class="wpfp-link" href="" title="Добавить в избранное">изменить цвет</a>
title меняется - Добавить в избранное - Удалить с избранного - ... после этого, мне нужно чтобы цвет менятся в зависимости от title.
Я ставил свой скрипт ниже скрипта для изменения названия, но он работает только раз - до перезагрузки страницы ничего не измениться.
0
 Аватар для Уф
890 / 725 / 447
Регистрация: 13.07.2015
Сообщений: 2,277
29.03.2017, 11:13
Лучший ответ Сообщение было отмечено Shoshona как решение

Решение

JavaScript
1
2
3
4
5
6
7
8
9
10
11
$(document).ready(function(){
$(".wpfp-link").on("click", function() {
  if($(this).attr("title")=="Добавить в избранное") {
     $(".fa-heart").css({color : "#f71e1e"});
     $(this).attr("title","Удалить из избранного");
  } else  {
     $(".fa-heart").css({color : "#333333"});
     $(this).attr("title","Добавить в избранное");
  }
});
});
1
 Аватар для Shoshona
30 / 30 / 37
Регистрация: 03.06.2014
Сообщений: 1,055
29.03.2017, 11:41  [ТС]
Уф, не работает.
Скрипт нужно ставить после ссылки?
0
 Аватар для Уф
890 / 725 / 447
Регистрация: 13.07.2015
Сообщений: 2,277
29.03.2017, 11:47
пофиг где, хтмл лучше весь напиши, а то не понятно какой блок ты хочешь менять и где он распологается
0
 Аватар для Shoshona
30 / 30 / 37
Регистрация: 03.06.2014
Сообщений: 1,055
29.03.2017, 12:07  [ТС]
Уф,
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 <script type="text/javascript">
 $(document).ready(function(){
            if($(".wpfp-link").attr("title")=="Добавить в избранное") $(".fa-heart").css({color : "#333333"});
            else 
        $(".fa-heart").css({color : "#f71e1e"});
    });
</script>
...
<i class="fa fa-heart" aria-hidden="true"></i>
<a class="wpfp-link" href="?wpfpaction=remove&amp;postid=48" title="Удалить из избранного" rel="nofollow">Удалить из избранного</a>
...
 <script type="text/javascript">
$(document).ready(function(){
$(".wpfp-link").on("click", function() {
  if($(this).attr("title")=="Добавить в избранное") {
     $(".fa-heart").css({color : "#f71e1e"});
  } else  {
     $(".fa-heart").css({color : "#333333"});
  }
});
});
</script>
Добавлено через 1 минуту
Уф, Наверное проблема в том, что ссылка работает через плагин wordpress. и js-файл плагина перебивает Ваш скрипт
0
 Аватар для fanatikus
1932 / 1523 / 703
Регистрация: 17.11.2012
Сообщений: 6,585
29.03.2017, 13:25
Цитата Сообщение от Shoshona Посмотреть сообщение
мне нужно чтобы цвет менятся в зависимости от title.
а почему тогда вы title не меняете
Цитата Сообщение от Shoshona Посмотреть сообщение
JavaScript
1
2
3
4
5
if($(this).attr("title")=="Добавить в избранное") {
* * *$(".fa-heart").css({color : "#f71e1e"});
* } else *{
* * *$(".fa-heart").css({color : "#333333"});
* }
вам же УФ написал с заменой title, а вы убрали

Добавлено через 5 минут
Цитата Сообщение от Shoshona Посмотреть сообщение
$(document).ready(function(){
* * * * * * if($(".wpfp-link").attr("title")=="Добавить в избранное") $(".fa-heart").css({color : "#333333"});
* * * * * * else
* * * * $(".fa-heart").css({color : "#f71e1e"});
* * });
тут, после загрузки страницы, если тайтл == 'Добавить в избранное' ставится color : "#333333"
дальше при клике
Цитата Сообщение от Shoshona Посмотреть сообщение
$(".wpfp-link").on("click", function() {
* if($(this).attr("title")=="Добавить в избранное") {
* * *$(".fa-heart").css({color : "#f71e1e"});
* } else *{
* * *$(".fa-heart").css({color : "#333333"});
* }
опять же проверяете если тайтл == 'Добавить в избранное', меняете цвет на color : "#f71e1e". и все, а тайтл то остался 'Добавить в избранное'. и дальше сколько не кликайте цвет не изменится. добавьте замену тайтл, как УФ советовал.
0
 Аватар для Shoshona
30 / 30 / 37
Регистрация: 03.06.2014
Сообщений: 1,055
29.03.2017, 13:26  [ТС]
Цитата Сообщение от fanatikus Посмотреть сообщение
а почему тогда вы title не меняете
title меняеться в скрипте плагина!
0
 Аватар для fanatikus
1932 / 1523 / 703
Регистрация: 17.11.2012
Сообщений: 6,585
29.03.2017, 14:06
Цитата Сообщение от Shoshona Посмотреть сообщение
title меняеться в скрипте плагина!
а вы уверены, что меняется? проверяли?
0
 Аватар для Shoshona
30 / 30 / 37
Регистрация: 03.06.2014
Сообщений: 1,055
29.03.2017, 14:42  [ТС]
Цитата Сообщение от fanatikus Посмотреть сообщение
а вы уверены, что меняется? проверяли?
странный вопросс.
Хотя если меня глаза обманывают, то все может быть
0
 Аватар для fanatikus
1932 / 1523 / 703
Регистрация: 17.11.2012
Сообщений: 6,585
29.03.2017, 15:55
Цитата Сообщение от Shoshona Посмотреть сообщение
странный вопросс.
вполне нормальный вопрос. я спросил потому что так
PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
        <script type="text/javascript">
            $(function () {
                if ($('.wpfp-link').attr('title') === 'Добавить в избранное'){
                    $('.fa-heart').css({color: '#333333'});
                }else{
                     $('.fa-heart').css({color: '#f71e1e'});
                }
               //допустим это выполняется скрипт плагина
                $('.wpfp-link').on('click', function (e) {
                    e.preventDefault();
                    if ($(this).attr('title') === 'Добавить в избранное') {
                        $(this).attr('title', 'Удалить из избранного');
                        $(this).text('Удалить из избранного');
                    } else {
                        $(this).attr('title', 'Добавить в избранное');
                        $(this).text('Добавить в избранное');
                    }
                });
                 // а это заменм цвета      
                 $('.wpfp-link').on('click', function (e) {
                    e.preventDefault();
                    if ($(this).attr('title') === 'Добавить в избранное') {
                        $('.fa-heart').css({color: '#333333'});
                    } else {
                        $('.fa-heart').css({color: '#f71e1e'});
                    }
                });
            });
        </script>
       
        <i class="fa fa-heart" aria-hidden="true">test of edit</i>
        <a class="wpfp-link" href="?wpfpaction=remove&amp;postid=48" title="Добавить в избранное" rel="nofollow">Добавить в избранное</a>
все прекрасно работает
1
 Аватар для Shoshona
30 / 30 / 37
Регистрация: 03.06.2014
Сообщений: 1,055
29.03.2017, 16:14  [ТС]
fanatikus, я понял, значит проблема в плагине. он перебивает Ваш скрипт. Спасибо, буду искать в чем проблема.
0
 Аватар для fanatikus
1932 / 1523 / 703
Регистрация: 17.11.2012
Сообщений: 6,585
29.03.2017, 16:36
Цитата Сообщение от Shoshona Посмотреть сообщение
он перебивает Ваш скрипт
думаю, дело не в этом.
а код, который в плагине меняет тайтл, можно глянуть.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
29.03.2017, 16:36
Помогаю со студенческими работами здесь

Изменение цвета фона при клике?
Нужно при нажатии на &quot;li&quot; изменять цвет фона на красный, потом если нажимаю на другой, то там меняется на красный, а у предыдущего...

Изменение цвета строки DataGridView при клике
мне нужно что бы при нажатие на кнопу выбраная строка изменяла свой цвет. При помощи такого кода получилось изменить цвет только...

Плавное изменение цвета объекта от зеленого до красного и обратно
Пишу программу, которая определяет качество связи с сервером, через посылку пакетов ping. На GUI есть индикатор в виде светодиода,...

Переключение цвета при клике
Правильно ли я сделал переключение цвета? Может можно упростить? $(document).ready(function() { var color = 1; ...

Смена цвета блока при клике
При клике на кнопку, в определённом блоке должен меняться и текст внутри блока на заданный в условии, и так же, должен меняться цвет самого...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
16
Ответ Создать тему
Новые блоги и статьи
PhpStorm 2025.3: WSL Terminal всегда стартует в ~
and_y87 14.12.2025
PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .
Access
VikBal 11.12.2025
Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук
volvo 07.12.2025
Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro
Музыка, написанная Искусственным Интеллектом
volvo 04.12.2025
Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
От async/await к виртуальным потокам в Python
IndentationError 23.11.2025
Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов
Argus19 22.11.2025
Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .
Сколько Государство потратило денег на меня, обеспечивая инсулином.
Programma_Boinc 20.11.2025
Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .
Ломающие изменения в C#.NStar Alpha
Etyuhibosecyu 20.11.2025
Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .
Мысли в слух
kumehtar 18.11.2025
Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .
Создание Single Page Application на фреймах
krapotkin 16.11.2025
Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2025, CyberForum.ru