Localisation avec JQuery?

Question

Je ne sais pas comment gérer la localisation avec JQuery. Je veux définir un innerHTML avec du texte en allemand, mais si le navigateur est configuré pour utiliser l'anglais, alors je veux définir le texte en anglais.

En PHP j'utilise gettext pour ce genre de choses, mais comment le faire en JavaScript/jQuery?

Answer 1

Il n'y a pas de solution facile pour cela. Ce que je ferais probablement est de créer plusieurs scripts avec des textes de langue pour chaque langue et d'en inclure un en PHP. Donc, si quelqu'un utilise la version anglaise de votre site vous inclure uniquement le fichier anglais, si quelqu'un utilise la version allemande vous devez inclure le fichier de langue allemande, etc.

Exemple:

// your script logic 
myscript.js 

// language texts 
myscript.en.js 
myscript.de.js 
myscript.it.js 
... 

Vous pouvez définir tous les fichiers de langue comme ça:

LANG = { 
    txt1: 'English text1', 
    txt2: 'English text2' 
    ... 
}; 

Assurez-vous pour ne l'un de ceux dans votre code HTML et assurez-vous d'inclure le fichier de langue première à savoir

<script type="text/javascript" src="myscript.de.js"></script> 
<script type="text/javascript" src="myscript.js"></script> 

Ensuite, vous pouvez utiliser ces textes localisés dans votre script principal par exemple:

$(document).ready(function() { 
    alert(LANG.txt1); 
}); 

ce qui est mieux à ce sujet est que votre logique (myscript.js dans cet exemple) n'a pas à se soucier de la localisation et vous gagné » Je dois le changer si vous voulez ajouter un nouveau fichier de langue.

Answer 2

Vous n'avez pas besoin de JQuery du tout. L'objet navigateur dans javascript (http://www.comptechdoc.org/independent/web/cgi/javamanual/javanavigator.html) contient une propriété userLanguage (IE) et une langue (Netscape/Firefox) définies par les paramètres régionaux actuels du navigateur.

Pour résoudre votre exemple, vous pouvez utiliser quelque chose comme;

 
    
    var textToSet = null; 
    var userLang = null; 

    /* 
    -if userLanguage exists they're in IE, else firefox 
    -get the first two letters in lowercase to guarantee 
    an easily evaluated base language 
    */ 
    if(navigator.userLanguage) baseLang = substring(navigator.userLanguage,0,2).toLowerCase(); 
    else baseLang = substring(navigator.language,0,2).toLowerCase(); 

    //check languages 
    switch(baseLang) 
    { 
    case "de": 
     //German 
     textToSet = "german text"; 
     break; 
    default: 
     textToSet = "english text"; 
    } 
    document.getElementById('elementToSetTextInto').innerHTML = textToSet; 

Gardez à l'esprit, vous voudrez peut-être un texte différent en fonction de la langue de base et locale .. dans ce regard de cas pour "en-us", "de-de". Sites pour les codes de culture sont facilement googled (1 lien sur le premier message seulement;))

Espoir qui fonctionne pour toi.

Answer 3

Faites un essai. Le bouton TranslateThis est un widget de traduction Javascript léger. Il traduit n'importe quelle page rapidement en utilisant AJAX et l'API Google Language.

Here...

Answer 4

Je ne l'ai pas utilisé, mais je pense à l'aide jquery-localize pour un projet. Si cela ne vous dérange pas de baser la traduction sur les attributs 'rel' définis sur vos éléments, cela ressemble à une bonne option.

Exemple du README:

HTML

<p rel="localize[title]">Tracker Pro XT Deluxe</p> 
<p rel="localize[search.placeholder]">Search...</p> 
<p rel="localize[search.button]">Go!</p> 
<p rel="localize[footer.disclaimer]">Use at your own risk.</p> 
<p rel="localize[menu.dashboard]">Dashboard</p> 
<p rel="localize[menu.list]">Bug List</p> 
<p rel="localize[menu.logout]">Logout</p> 

application es.JSON

{ 
    title: "Tracker Pro XT Deluxo", 
    search: { 
    placeholder: "Searcho...", 
    button: "Vamos!" 
    }, 
    footer: { 
    disclaimer: "Bewaro." 
    }, 
    menu: { 
    dashboard: "Dashboardo", 
    list: "Bug Listo", 
    logout: "Exito" 
    } 
} 

localiser!

$("rel*=localize").localize("application", { language: "es" }) 

Answer 5

Une autre option que vous pouvez regarder dans le Microsoft proposé jquery-global plugin. C'est encore dans l'esprit bêta.

Answer 6

Puisque vous utilisez déjà gettext avec votre application php, vous devriez regarder dans ce javascript implementation of gettext

Il n'utilise pas les fichiers compilés .mo mais il utilisera vos fichiers .po que vous avez déjà.

Cette méthode a l'avantage de gérer toutes vos traductions en un seul endroit.