Как написать на страницу без ограничения длины документа. - PullRequest
0 голосов
/ 16 марта 2009

Я очень сильно не человек javascript / html / css.

Несмотря на это, я нахожусь в положении необходимости делать веб-страницу. Это статическое единственное, что вы можете сделать на нем, это нажать на флажки, чтобы изменить язык дисплеев на основе куки.

Если cookie говорит «это», я пишу текст на одном языке, а если cookie говорит «это», я пишу на другом языке. Это прекрасно работает, но я должен использовать лотов операторов document.write, и это уродливо и громоздко.

Сейчас я набираю нужный текст и использую макрос в emacs, чтобы сложить текст примерно 80 символов и поставьте document.write(" в начале каждой строки и "); в конце. Затем я вставляю его на веб-страницу в if(cookie_this) { } else { }.

Должен быть лучший способ сделать это ... Пожалуйста?
Редактировать :
Я искал обходные пути для ограничений в document.write

Ограничения:

  • Нет серверной магии, что означает отсутствие ruby ​​/ php / perl
  • Только одна страница, или, вернее, только один видимый URL
  • Решение должно быть проще, чем рабочее у меня

Ответы [ 7 ]

3 голосов
/ 16 марта 2009

Расширение на ответ Артлунга :

Вы можете отображать или скрывать объекты с помощью атрибута lang (или любых других критериев, например имени класса). В jQuery и HTML:

<p>Language:
    <select id="languageSelector">
        <option value="en">English</option>
        <option value="es">Espa&ntilde;ol</option>
    </select>
</p>

<div lang="en-us">
Hello
</div>

<div lang="es">
Hola
</div>

<script type="text/javascript">
var defaultLanguage = 'en';
var validLanguages = ['en', 'es'];

function setLanguage(lang, setCookie) {
    if(!$.inArray(languages, lang))
        lang = defaultLang;

    if(typeof(setCookie) != 'undefined' && setCookie) {
       $.cookie('language', lang);
    }

    // Hide all things which can be hidden due to language.
    $('*[lang]').filter(function() { return $.inArray(languages, $(this).attr('lang')); }).hide();

    // Show currently selected language.
    $('*[lang^=' + lang + ']).show();
}

$(function() {
    var lang = $.cookie('language'); // use jQuery.cookie plugin
    setLanguage(lang);

    $('#languageSelector').change(function() {
        setLanguage($(this).val(), true);
    });
});
</script>
1 голос
/ 16 марта 2009

Если вам нужен только один видимый URL, но вы можете разместить несколько страниц на сервере, вы также можете попробовать XHR. Я использую jQuery , потому что я наиболее знаком с ним, хотя можно было бы реализовать только в javascript:

<html>
 <head>
  <script type="text/javascript" src="path/to/jquery.js"> </script>
  <script type="text/javascript">
   $(document).ready(function () {
       if (cookie_this) {
           $("body").load("onelanguage.html body");
       } else {
           $("body").load("otherlanguage.html body");
       }
   });
  </script>
 </head>
 <body>
 </body>
</html>
1 голос
/ 16 марта 2009

Я думаю, что правильный способ сделать это - проанализировать заголовок Accept-Language и выполнить это на стороне сервера.

Но в том случае, если вы застряли со сценариями на стороне клиента. Скажем, ваш контент был помечен как

<script type="text/javascript">
if(cookie_this) { 
document.getElementById('esContent').style.display = 'block';
} else {
document.getElementById('enContent').style.display = 'block';
}
</script>

<div id="esContent" style="display:none">
Hola, mundo.
</div>

<div id="enContent" style="display:none">
Hello, world.
</div>

Это не ухудшается для людей с включенным CSS и отключенным JavaScript. Другие подходы могут включать использование Ajax для загрузки содержимого на основе значения cookie (для этого можно использовать jQuery).

1 голос
/ 16 марта 2009

jQuery может сделать это с гораздо меньшей легкостью, но вы можете создать элемент, а затем установить его свойство innerHTML. Возможно, вам придется немного изменить свой вызов, чтобы добавить дочерний элемент. Смотрите createElement функция для получения дополнительной информации. Например

<script type="text/javascript">
  function writeElement(language, elementId) {
    var newElement = document.createElement("span");
    if (language = "this") {
      newElement.innerHTML = "text for this";
    }
    else {
      newElement.innerHTML = "text for that";
    }
    var element = document.getElementById(elementId);
    element.appendChild(newElement);
  }
</script>

Использование

<span id="data1"></span>
<script type="text/javascript">
  writeElement("this", "data1")
</script>

Добавьте комментарий, если вы можете поддерживать jQuery, и вместо этого вам нужен пример этого.

0 голосов
/ 16 марта 2009

Нет хорошего способа сделать это в JS. Лучший способ - использовать ОЧЕНЬ простой PHP-код. Но, если хотите, в JS есть способ - подготовьте страницы, подобные этим:

  • некоторые страницы с разными языковыми версиями, например index_en.html, index_ru.html
  • главная страница index.html, где у вас есть код, например if (cookie) windows.location.replace ('index_en.html') else ...
0 голосов
/ 16 марта 2009

Это не соответствует (отредактированному) критерию исходного вопроса, но может быть полезно независимо.

Использовать серверный скрипт. То, что вы ищете, может быть легко сделано в PHP. Вы, вероятно, захотите иерархию документов, основанную на языке, и посмотрите на это. Например, дерево каталогов:

/en/
/en/page1.html
/en/page2.html
/es/
/es/page1.html
/es/page2.html

В PHP это так же просто, как

$language = $_GET['lang'];
$page = $_GET['page'];
include($language . '/' . $page);
// URL is: /whatever.php?lang=LANGUAGE_HERE&page=PAGE_HERE

Однако, у этого есть много проблем безопасности наряду с этим. Очистите введенные данные и убедитесь, что каталог и файл существуют. Более полный пример:

$contentRoot = './';      // CHANGE ME.  Do include trailing /.
$defaultLanguage = 'en';  // CHANGE ME.
$defaultPage = 'home';    // CHANGE ME.

if(isset($_GET['lang']))
    $language = $_GET['lang'];
else
    $language = substr($_SERVER['HTTP_ACCEPT_LANGUAGE'], 2);

if(isset($_GET['page']))
    $page = $_GET['page'];
else
    $page = $defaultPage;

$languageDir = basename($_GET['lang']) . '/';
$pageFile = basename($page) . '.html';

if(!file_exists($contentRoot . $languageDir) || !is_dir($contentRoot . $languageDir))
    $languageDir = $defaultLanguage;

$fullFileName = $contentRoot . $languageDir . $pageFile;

if(!file_exists($fullFileName) || !is_file($fullFileName) || !is_readable($fullFileName))
    $pageFile = $defaultPage;

readfile($fullFileName);
// Or, if you want to parse PHP in the file:
include($fullFileName);

Вы также можете использовать mod_rewrite (Apache), чтобы разрешить URL, такие как http://www.mysite.com/en/page1. (Только убедитесь, что скрыли фактическую страницу.)

// TODO mode_rewrite rules

Другой подход заключается в размещении вышеуказанной иерархии в корне документа и раздаче URL-адресов напрямую. Это, однако, дает вам меньше возможностей (например, создавать шаблоны сложнее), и вам нужно беспокоиться о том, чтобы на внешние носители ссылались должным образом.

Если вы ищете динамический подход, на стороне клиента используйте Javascript для извлечения данных с использованием Ajax. Это также тривиально и не требует динамической серверной части. Я рекомендую Javascript Framework, такой как jQuery, чтобы сделать это как можно проще.

0 голосов
/ 16 марта 2009

Обнаружение должно быть на сервере (предпочтительно на основе заголовка Accept-Language , отправленного клиентом), и вы должны отправить статический файл, который уже локализован.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...