• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Tłumaczenie zawartości listy w JavaScript

Aruba Cloud - Virtual Private Server VPS
+1 głos
185 wizyt
pytanie zadane 27 lipca 2021 w JavaScript przez xjafajx Użytkownik (740 p.)

Cześć,

Mam problem z tłumaczeniem nazw w menu.

Otóż wszystkie teksty na stronie tłumaczy mi spoko tylko nie wiem jak mam przetłumaczyć tekst w menu.

Tekst w menu zapisany jest w javascriptowej liście

 var planet = ["Strona główna", "Strona 7", "Strona 6","Strona 5", "Strona 4", "Strona 3", "Strona 2", "Strona 1"];

a w HTML jest podmieniana nazwa w tym miejscu

					<div class="name_container">
					<p class="pn">Strona główna</p>
					</div>

jak mogę zrobić aby po wybraniu odpowiedniego języka tłumaczył mi zawartość menu odpowiednio do wybranego języka?

Kod można podejrzeć na tej stronie: https://codepen.io/xjafajx/pen/YzVeOYM

Z góry dziękuje za pomoc

1 odpowiedź

0 głosów
odpowiedź 28 lipca 2021 przez VBService Ekspert (256,600 p.)
wybrane 28 lipca 2021 przez xjafajx
 
Najlepsza

Możesz też dodać drugą tablicę z tłumaczeniem (jak masz teraz translate_to_english, translate_to_polish) np.

const  planet_to_polish =  ["Strona główna", "Strona 7", ... , "Strona 1"],
      planet_to_english =  ["Home page", "Page 7", ..., "Page 1"];

i podmieniać na zasadzie "klonowania" zawartość tablicy planet

 

3 Ways to Copy or Clone Array in Javascript

 

np.:

const  planet_to_polish =  ["Strona główna", "Strona 7", "Strona 6","Strona 5", "Strona 4", "Strona 3", "Strona 2", "Strona 1"],
      planet_to_english =  ["Home page", "Page 7", "Page 6","Page 5", "Page 4", "Page 3", "Page 2", "Page 1"];

var planet = [...planet_to_polish]; // ustawienie domyślne - pierwsze uruchomienie strony

no i odpowiedni wpis dodać do 

    switch(e.target.id) {
      case "english": insertTranslate(translate_to_english);
                      // np. tutaj dla english
        break;
      case "polish": insertTranslate(translate_to_polish);
                      // np. tutaj dla polish
        break;

    }

 

no i trzeba wtedy "zaprogramować" podmianę tekstu w monecie zmiany języka( kliknięcia na wybraną flagę), bo w trakcie przewijania już tekst jest "podmieniany".

komentarz 2 sierpnia 2021 przez xjafajx Użytkownik (740 p.)
Próbowałem tak samo zrobić w moim kodzie ale coś mi nie wychodzi.

Nie podmienia listy tylko data-translate-id od 0 do 7. Menu nie zmienia języka.

Czy możesz mi dokładniej to zaprezentować bo nie wiem gdzie robię błąd... ☹️
komentarz 3 sierpnia 2021 przez VBService Ekspert (256,600 p.)
edycja 3 sierpnia 2021 przez VBService

To zostaje

const  planet_to_polish =  ["Strona główna", "Strona 7", "Strona 6","Strona 5", "Strona 4", "Strona 3", "Strona 2", "Strona 1"],
      planet_to_english =  ["Home page", "Page 7", "Page 6","Page 5", "Page 4", "Page 3", "Page 2", "Page 1"];
 
var planet = [...planet_to_polish]; // ustawienie domyślne - pierwsze uruchomienie strony

to planet_to_english, usuń

const translate_to_english = [
    planet_to_english,
    'Home',
    "Lorem Ipsum ..."
    . . .
];

to samo tu, planet_to_polish, usuń

const translate_to_polish = [
    planet_to_polish,
    'Główna',
    "Lorem Ipsum ..."
    . . .
];

zapisz tak

const translate_to_english = [
    null,
    'Home',
    "Lorem Ipsum ..."
    . . .
];

const translate_to_polish = [
    null,
    'Główna',
    "Lorem Ipsum ..."
    . . .
];

 

dopisz w 

    switch(e.target.id) {
      case "english": planet = [...planet_to_english];
                      insertTranslate(translate_to_english);                      
        break;
      case  "polish": planet = [...planet_to_polish];
                      insertTranslate(translate_to_polish);                      
        break;                
    }

ponieważ Twoja zmienna moon_id i tablica planet  jest globalna to możemy ją wykorzystać np. tu

    function insertTranslate(translate) {
      const content_to_translate = document.querySelectorAll('[data-translate-id]');

      // <p class="pn" data-translate-id="0">Strona główna</p>
      content_to_translate[0].textContent = planet[moon_id];
      
      content_to_translate.forEach((tag_html, index) => {
        if (index > 0) tag_html.innerHTML = translate[index];
      });
    }

 

komentarz 3 sierpnia 2021 przez xjafajx Użytkownik (740 p.)
Wielkie dzięki.

Działa poprawnie :D

A jeszcze na koniec ostatnie pytanko co zrobić jeżeli js mam rozbitego na dwa pliki tzn.

wszystko od const translate_to_english = [...]; i poniżej mam w pliku language.js a wszystko powyżej co sie znajduje w pliku script.js to jak przesyłać pomiędzy plikami potrzebne zmienne i zawartość?

Jak to najlepiej połączyć żeby dobrze funkcjonowało?

Podobne pytania

0 głosów
0 odpowiedzi 136 wizyt
pytanie zadane 26 lipca 2021 w JavaScript przez xjafajx Użytkownik (740 p.)
0 głosów
1 odpowiedź 776 wizyt
pytanie zadane 13 września 2020 w PHP przez SyriuszBlack Nowicjusz (120 p.)
0 głosów
2 odpowiedzi 2,394 wizyt
pytanie zadane 23 maja 2017 w JavaScript przez nitrio578 Początkujący (270 p.)

93,335 zapytań

142,331 odpowiedzi

322,415 komentarzy

62,670 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Wprowadzenie do ITsec, tom 1 Wprowadzenie do ITsec, tom 2

Można już zamawiać dwa tomy książek o ITsec pt. "Wprowadzenie do bezpieczeństwa IT" - mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy aż 15% zniżki! Dziękujemy ekipie Sekuraka za fajny rabat dla naszej Społeczności!

...