2009-08-01 11 views
12

Non ho idea di come gestire la localizzazione con JQuery. Voglio impostare un innerHTML con testo in tedesco, ma se il browser è configurato per usare l'inglese, allora voglio impostare il testo in inglese.Localizzazione con JQuery?

In PHP io uso gettext per tale roba, ma come farlo in JavaScript/jQuery?

risposta

15

Non esiste una soluzione facile. Quello che probabilmente farei è creare diversi script con testi in lingua per ogni lingua e includerne uno in PHP. Quindi, se qualcuno sta utilizzando la versione inglese del sito che si includere solo file di inglese, se qualcuno sta utilizzando la versione tedesca si dovrebbe includere file di lingua tedesca, ecc

Esempio:

// your script logic 
myscript.js 

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

È possibile definire tutti i file di lingua così:

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

assicurarsi che si sta includendo solo uno di quelli nel tuo codice HTML e assicurarsi di includere file della lingua prima cioè

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

quindi è possibile utilizzare quei testi localizzate nello script principale per esempio:

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

Cosa c'è di meglio a questo proposito è che la logica (myscript.js in questo esempio) non deve preoccuparsi di localizzazione e hai vinto' t necessario cambiarlo se si desidera aggiungere un nuovo file di lingua.

3

In realtà non è necessario JQuery.

L'oggetto di navigazione in javascript (http://www.comptechdoc.org/independent/web/cgi/javamanual/javanavigator.html) contiene una proprietà userLanguage (IE) e lingua (Netscape/Firefox) impostata dalle impostazioni locali correnti del browser.

Per risolvere il tuo esempio potresti usare qualcosa di simile;

 
    
    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; 


Tenete a mente, si potrebbe desiderare di testo diverso in base al largo della lingua di base e locale .. in quel caso look per "it-it", "de-de". Siti di codici culturali sono facilmente Googled (1 link sul primo post solo;))

Speranza che funziona per te.

0

Provatelo. Il pulsante TranslateThis è un widget di traduzione Javascript leggero. Traduce qualsiasi pagina velocemente usando AJAX e l'API di Google Language.

Here...

7

non ho ancora usato, ma sto pensando di usare jquery-localize per un progetto. Se non ti dispiace basare la traduzione sugli attributi "rel" definiti sui tuoi elementi, allora sembra una buona opzione.

Esempio dal 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> 

applicazione-es.JSON

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

localizzarlo!

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

Un'altra opzione è possibile esaminare è la Microsoft ha proposto jquery-global plugin. È ancora nella mente beta.

1

Dal momento che si utilizza già gettext con l'applicazione PHP, si dovrebbe considerare di usare questo javascript implementation of gettext

Esso non utilizza i file compilati .mo ma utilizzerà i tuoi file .po che già avete.

Questo metodo ha il vantaggio di gestire tutte le tue traduzioni in un unico luogo.