Как сделать кнопку постоянно активной?

Question

Делаю переключение языков на сайте через 2 кнопки, есть отельный файл с переводами каждого класса, при нажатии на кнопку язык переключает без ошибок, но всего на долю секунды. Как решить?

buttonUA.addEventListener('click', changeURLLanguageUA);
buttonEN.addEventListener('click', changeURLLanguageEN);

// Перенаправляет URL с указанием языка
function changeURLLanguageUA(){
 let lang = buttonUA.value;
 location.href = window.location.pathname + '#'+lang;
 location.reload();
}
function changeURLLanguageEN(){
 let lang = buttonEN.value;
 location.href = window.location.pathname + '#'+lang;
 location.reload();
}

// Функции перевода
buttonUA.addEventListener('click', function() {
 hash = buttonUA.value
 for (let key in langland) {
    document.querySelector('.lng-' + key).innerHTML = langland[key][hash];
  }
});
buttonEN.addEventListener('click', function() {
 hash = buttonEN.value
 for (let key in langland) {
    document.querySelector('.lng-' + key).innerHTML = langland[key][hash];
  }
});

Answer 1

У вас два обработчика клика на каждую из кнопок. Один обработчик переводит данные, другой - перенаправляет. Получается, что вначале успевает один сработать, потом происходит перезагрузка страницы. Вы определитесь что вы хотите. Скорее всего вам надо перевод данных делать не по клику на кнопку а после перезагрузки страницы, т.е. на событии DOMContentLoaded

document.addEventListener("DOMContentLoaded", function(event) {
    ... тут код    
    ... считываем хэш из URL     
    ... вызываем функцию перевода с передачей туда значение хэша
    ... ПРИ ЭТОМ ФУНКЦИЯ ПЕРЕВОДА ОСТАНЕТСЯ ОДНА....этого достаточно
});

БЛОГ НА HUSL

Как сделать кнопку постоянно активной?

Ответы (1 шт):