Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Смена языка на сайте (https://javascript.ru/forum/misc/83605-smena-yazyka-na-sajjte.html)

wemon 21.01.2022 21:12

Смена языка на сайте
 
Здравствуйте.
Подскажите пожалуйста как сделать приключение языков.
Сейчас разбил по каталогам для разных языков в таком виде:
https://stock.ck.ua/ru/catalog/7451362/
https://stock.ck.ua/ua/catalog/7451362/

Но теперь не могу понять как реализовать переключении между /ru/ и /ua/ а оставшийся путь не менялся.
Подскажите пожалуйста как сделать ?

рони 21.01.2022 21:48

смена языка ru/ua
 
wemon,
добавить на обе страницы.
<!DOCTYPE html>
<html >
<head ></head>
<body><select class="lang">
    <option value="ru">ru</option>
    <option value="ua">ua</option>
    </select>
</body>
<script>
    document.addEventListener("DOMContentLoaded", () => {
        const select = document.querySelector(".lang");
        let url = window.location.href, value;
        for ({
                value
            } of select.options) {
            if (value && url.includes(value, 19)) {
                select.value = value;
            }
        };
        select.addEventListener("change", _ => {
        if(!select.value) return;
        url = `https://stock.ck.ua/${select.value}/catalog/7451362/`;
        window.location.href = url;
        })
    });
</script>
</html>

wemon 21.01.2022 21:56

Спасибо добавил. Но почему-то срабатывает один раз. Потом на этой же странице нельзя переключить обратно.

рони 21.01.2022 22:01

Цитата:

Сообщение от wemon
Потом на этой же странице

скопируйте скрипт и селект по новой

wemon 21.01.2022 22:14

Все работает. Можете также подсказать сейчас попробовал вставить в другой каталог https://stock.ck.ua/ua/catalog/7451363/ он перенаправляется /catalog/7451362/
Как сделать ${select.value}/catalog/7451362/`; что бы путь менялся в зависимости от текущей ссылки. То есть чтобы заменялась только та часть ссылки /ru/ и /ua/

рони 21.01.2022 22:30

wemon,
пробуйте ...
<!DOCTYPE html>
<html >
<head ></head>
<body><select class="lang">
    <option value="ru">ru</option>
    <option value="ua">ua</option>
    </select>
</body>
<script>
document.addEventListener("DOMContentLoaded", () => {
        const select = document.querySelector(".lang");
        let url = window.location.href, value, reg;
        for ({ value } of select.options) {
            reg = new RegExp(`/${value}/`);
            if (value && reg.test(url)) {
                select.value = value;
                break;
            }
        };
        select.addEventListener("change", _ => {
        if(!select.value) return;
        url = url.replace(reg, `/${select.value}/`);
        window.location.href = url;
        })
    });
</script>
</html>

wemon 21.01.2022 22:43

Последний вариант, срабатывает один раз на странице. Потом не переключает.

рони 21.01.2022 23:18

wemon,
break забыл добавить. скопируйте снова #6

wemon 21.01.2022 23:39

рони,
Спасибо Вам большое. Все работает.

wemon 19.02.2022 20:20

рони,
Здравствуйте можете пожалуйста помочь с другим вариантом, только уже для ссылочного переключателя по аналогу как для select.
Сейчас сделал переключатель ссылками (УКР | РУС) для 2-х страниц, вот пример:
https://stock.ck.ua/ru/catalog/
Для разных страниц на которых находишься выводится по разному:
Если на Русской версии:
<ul class="lang-switcher">
<li class="lang-ua"><a href="/ua/catalog/">УКР</a></li>
<li class="lang-ru"><span>РУС</span></li>
</ul>

Если на Украинской версии:
<ul class="lang-switcher">
<li class="lang-ua"><span>УКР</span></li>
<li class="lang-ru"><a href="/ru/catalog/">РУС</a></li>
</ul>

Подскажите как реализовать это для всех страниц сайта?


Часовой пояс GMT +3, время: 04:47.