2009-08-01 15 views
12

No tengo idea de cómo manejar la localización con JQuery. Quiero establecer un innerHTML con texto en alemán, pero si el navegador está configurado para usar inglés, entonces quiero configurar el texto en inglés.Localización con JQuery?

En PHP uso gettext para tales cosas, pero ¿cómo hacerlo en JavaScript/jQuery?

Respuesta

15

No hay una solución fácil para eso. Lo que probablemente haría es crear varios guiones con textos de lenguaje para cada idioma e incluir el adecuado en PHP. Así que si alguien está usando la versión Inglés de su sitio debería incluir solamente archivo de Inglés, si alguien está usando la versión alemana debería incluir archivo de idioma alemán, etc.

Ejemplo:

// your script logic 
myscript.js 

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

Se pueden definir todos los archivos de idioma así:

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

Asegúrese de que está incluyendo sólo uno de ellos en el código HTML y asegúrese de incluir el archivo de idioma primero es decir

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

continuación, puede utilizar esos textos localizados en el script principal, por ejemplo:

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

qué es lo mejor de todo es que su lógica (myscript.js en este ejemplo) no tiene que preocuparse acerca de la localización y ganado' Tiene que cambiarlo si quiere agregar un nuevo archivo de idioma.

3

Realmente no necesita JQuery en absoluto.

El navegador de objetos en javascript (http://www.comptechdoc.org/independent/web/cgi/javamanual/javanavigator.html) contiene una propiedad de idioma de usuario (IE) y de idioma (Netscape/Firefox) establecida por la configuración regional actual del navegador.

Para resolver su ejemplo, podría usar algo como;

 
    
    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; 


que tener en cuenta, es posible que desee un texto diferente con sede fuera de idioma base y la configuración regional .. en ese caso look para "en-us", "de-de". Los sitios para códigos de cultura se pueden buscar fácilmente en Google (1 enlace en la primera publicación solamente;))

Espero que eso funcione para ti.

0

Dale una oportunidad. El botón TranslateThis es un widget ligero de traducción de Javascript. Traduce cualquier página rápidamente usando AJAX y la API de Google Language.

Here...

7

No he utilizado todavía, pero estoy pensando en usar jquery-localize para un proyecto. Si no te importa basar la traducción en los atributos 'rel' definidos en tus elementos, parece una buena opción.

Ejemplo de la 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> 

aplicación-es.JSON

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

localizarlo!

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

Desde ya utiliza gettext con su aplicación PHP, usted debe buscar en el uso de este javascript implementation of gettext

No utiliza los archivos compilados .mo pero va a usar sus archivos .po que ya tiene.

Este método tiene la ventaja de administrar todas sus traducciones en un solo lugar.