Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Я в тупике .show .hide (Как сделать многоязычный сайт) (https://javascript.ru/forum/misc/2377-ya-v-tupike-show-hide-kak-sdelat-mnogoyazychnyjj-sajjt.html)

Евгений 17.12.2008 11:20

Я в тупике .show .hide (Как сделать многоязычный сайт)
 
<head>
<style>
      .show {
          display: block;
          visibility: visible;
               }

      .hide {
          display: none;
          visibility: hidden;
              }
</style>

 <script>
              function switchLang(lng)
              {
                      var lngHide = (lng == 'ru') ? 'en' : 'ru';
                      document.getElementById(lng).className = 'show';
                      document.getElementById(lngHide).className = 'hide';
              }
</script>
</head>

<body>

   <p>
          <a href="javascript:switchLang('en')">  En  </a> 
          <a href="javascript:switchLang('ru')">   Ru  </a>
   </p>


<= Этот класс работает
<div id="en" class="hide">English text</div>       
                                                                       
      <div id="ru" class="show">Russian text</div>


<= следующий не работает
<div id="en" class="hide">новый English text</div>
                                                                  
      <div id="ru" class="show">новый Russian text</div>

<body>

Вот какая проблема, одна ссылка работает, то есть переключается,
а если помещаю две или три таких, то работает только верхний класс, а нижние не переключают язык.


Kolyaj 17.12.2008 11:23

Вот чисто логически, что должен вернуть document.getElementById('ru'), если элементов с id='ru' на странице несколько?

Евгений 17.12.2008 11:27

false? Подскажите как сделать?

ZoNT 17.12.2008 11:41

расшифровываю getElementById:
get - получить
Element - элемент (не элементЫ, а элеменТ!!!)
ById - по его айди.

Соответственно, вы получите элемент (один). А раз у вас несколько элементов с одинаковым айди, какой из них вы получите? Скорее всего первый, так как одинаковые id запрещены!

Что делать:
во-первых, не мучать пользователя и НЕ ГРУЗИТЬ ДВЕ ВЕРСИИ (3, 4 .. n версий) одного и того же контента!!!
во-вторых, сделать разные странички для разных языков и просто переключаться между ними... Ну а выбор языка можно запоминать в куку, чтобы при следующем заходе грузить страницу с необходимым языком...

Евгений 17.12.2008 11:46

понятно, просто страничка одна контента мало. Ладно сделаем по старинке. Всё равно спасибо.

ZoNT 17.12.2008 12:17

Сегодня страничка одна, завтра добавиться вторая, потом контента прибавится... И так дале... получится свалка... Не надо наплевательски относиться к проектированию странички даже если она маленькая.

kvl 18.12.2008 11:31

В библиотеках (я юзаю напр. prototype) есть функции типа "getElementsByClassName", можно присвоить всем нужным элементам один класс, отобрать их, а в функции switchLang(lng) менять не className, а только небходимые стилевые опции display, visible. Без библиотеки - можно несложным скриптом отобрать все нужные id по какому-нибудь признаку или списку.
В prototype ваще можно отбирать элементы по любому допустимому css-селектору - для этого имеется функция $$().

Kolyaj 18.12.2008 12:25

kvl,
Это все делается намного проще.
Данную задачу на js, конечно, выполнять не следует, но подход объяснить на ней можно.

Всем элементам, в которых содержится контент на определенном языке дать два класса: lang и имя языка (ru, en, ...).
<div class="lang ru">Привет, мир!</div>
<div class="lang en">Hello, World!</div>


Пишем стили:
Код:

.lang {
  display: none;
}
body.ru .ru {
  display: block;
}
body.en .en {
  display: block;
}

Теперь при переключении языка просто меняем класс у body на название языка.

kvl 18.12.2008 12:57

А менять класс у body ты тоже без js изловчишься? ;)

Kolyaj 18.12.2008 13:28

А я где-то сказал, что без js?

kvl 18.12.2008 13:33

Цитата:

Сообщение от Kolyaj (Сообщение 9683)
А я где-то сказал, что без js?

Вот:

Цитата:

Сообщение от Kolyaj (Сообщение 9681)
kvl,
Это все делается намного проще.
Данную задачу на js, конечно, выполнять не следует, но подход объяснить на ней можно.

Русские не сдаются? :)

Kolyaj 18.12.2008 13:36

А тему топика смотрели?

kvl 18.12.2008 13:41

вопрос риторический

Kolyaj 18.12.2008 13:55

Для особо одаренных уточню фразу
Цитата:

Сообщение от Kolyaj
Данную задачу на js, конечно, выполнять не следует, но подход объяснить на ней можно.

Реализацию многоязычного сайта не следует делать на JavaScript, но на ее примере можно объяснить принцип реализации подобных задач.

kvl 18.12.2008 14:36

OK, будем считать что кто-то кого-то не понял.
На одном заборе тоже кое-что написано было, а на самом деле за ним лежали только дрова...
Просто "сделать многоязычный сайт" - здесь даже не обсуждалось (кроме названия темы), речь шла об элементарной подзадаче смены стилей.


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