@Danny13

Как определить два свитчера одновременно в моей JS функции?

У меня есть свитчер, который переключает цвет темы сайта с темного на светлый и наоборот.
Он работает.
Но я добавил ещё один свитчер, который должен запускать ту же функцию. (то есть тот же свитчер, но в другом меню сайта) и он не работает.

Вот мой html код:

<! -- Первый свитчер  -->
<div class="switch">
    <label>
         Светлая тема
        <input type="checkbox">
        <span class="lever"></span>
         Тёмная тема
     </label>
</div>

<! -- Второй свитчер но с дополнительным классом  -->
<div class="switch  switcher_sidebar_padding">
    <label>
         Светлая тема
        <input type="checkbox">
        <span class="lever"></span>
         Тёмная тема
     </label>
</div>


И вот собственно работающая Javascript функция.
const toggleSwitch = document.querySelector('.switch input[type="checkbox"] ');
const currentTheme = localStorage.getItem('theme');

if (currentTheme) {
    document.documentElement.setAttribute('data-theme', currentTheme);
    if (currentTheme === 'dark') {
        toggleSwitch.checked = true;
    }
}
function switchTheme(e) {
    if (e.target.checked) {
        document.documentElement.setAttribute('data-theme', 'dark');
        localStorage.setItem('theme', 'dark');
    } else {
        document.documentElement.setAttribute('data-theme', 'light');
        localStorage.setItem('theme', 'light');
    }
}
toggleSwitch.addEventListener('change', switchTheme, false);


Моя попытка привязать эту функцию ко второму свитчеру. Но так не работает...
const toggleSwitch = document.querySelector('.switch input[type="checkbox"], .switch.switcher_sidebar_padding input[type="checkbox"], ');
//Далее следует тот же код, что и в выше написанной функции...


Так выглядит первый свитчер.
5ecc00fc28090091501457.png
5ecc01070b944290646998.png
Второй выглядит также но просто находится в другом меню.
  • Вопрос задан
  • 41 просмотр
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
29 мар. 2024, в 17:14
4000 руб./за проект
29 мар. 2024, в 17:04
5000 руб./за проект
29 мар. 2024, в 17:03
3000 руб./за проект