2012-01-31 7 views

Respuesta

3

He tenido el mismo problema, y ​​resolví el problema simplemente usando la función Jquery Extend.

Diga a definir sus recursos lingüísticos de la siguiente manera:

1) Crear un archivo de recursos con la localización por defecto, es de suponer se define en Inglés. Digamos que es resources.default.js

var MyApp = MyApp || {}; 

MyApp.resources = { 
    One: "One", 
    Two: "Two", 
    Three:"Three"  
} 

2) Definir los recursos localizados en archivos independientes, digamos español. Llamarlo resources.es.js

var localizedResources = { 
    One: "Uno", 
    Two: "Dos", 
    Three:"Tres"  
} 

3) En la lógica de servidor, decide que necesita para incluir sólo las traducciones por defecto en caso de Inglés, o si necesita cualquier otro idioma un include.

<script src="resources.es.js"> </script> 

4) crear su página web, y añadir secuencias de comandos para manejar su inclusión de los recursos, por el paso 3.

<html> 
<head> 
</head> 
<body> 

​<h1>Welcome to my App</h1> 
<p>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​Welcome to this test app</p> 

<button>Click me</button>​ 



<script src="resources.default.js"> </script> 


// The server decided we needed Spanish translations. 
<script src="resources.es.js"> </script> 


<script type="text/javascript"> 
    //Extend the translations into the resources object. 

    $.extend(MyApp.resources, localizedResources); 

    $(window).ready(function(){ 
     $('button').click(function(){ 
      alert(MyApp.resources.One);  
     });  
    }); 

</script> 
</body> 

Esto debería funcionar para usted. EDIT: verlo en acción aquí: http://jsfiddle.net/agarcian/rrDv3/1/

+0

Parece buena solución, pero no puedo acceder a localizedResources, sólo en la traducción del defecto (Inglés) trabaja. que utiliza interruptor de traducción en el documento listo: $ (document) ready (function() {$ \t .extend (MyApp.resources, localizedResources); \t}); y definición en la cabeza después de todos los scripts JS: redrom

+0

Por favor, eche un vistazo a esto: http://jsfiddle.net/agarcian/rrDv3/1/ Funciona. – agarcian

+0

para mal, no funciona fuera de línea – Astronaut

2

estoy usando el siguiente script para mis proyectos. Le permite cambiar el idioma "en tiempo de ejecución", sin volver a cargar la página. El script es "autorun", simplemente agrégalo al final de la página html. Podría tener algunos errores;)

// AutoStar! 
// Grab the parameters from my url, and initialize myself! FUGOOOOO 
(function __lang_init_wrapper() 
{ 
    var scriptSrc = $('script[src*=Lang]').attr('src'); 
    var myParams = parseParams(scriptSrc); 

    new Lang(myParams.language.toUpperCase(), true); 

})(); 

/** 
* Thanks to: http://wowmotty.blogspot.com/2010/04/get-parameters-from-your-script-tag.html 
* @param n 
* @param s 
*/ 
function gup(n,s){ 
n = n.replace(/[\[]/,"\\[").replace(/[\]]/,"\\]"); 
var p = (new RegExp("[\\?&]"+n+"=([^&#]*)")).exec(s); 
return (p===null) ? "" : p[1]; 
} 

/** 
* 
* @param language The language to use 
* @param replaceText If true, replace all the occurency marked with placemark {lang=<key>} 
*/ 
function Lang(language, replaceText) 
{ 

    var Languages = 
    { 
     ENG: 
     { 
      ok: 'ok' 
      ,yes: 'yes' 
      ,no: 'no' 
      ,unknown_user: 'Unknown user' 
      ,too_soon: "It's not time, yet..!" 
     } 

     ,ITA: 
     { 
      yes: 'si' 
      ,unknown_user: 'Utente sconosciuto' 
      ,too_soon: "Pazienta ancora un po'..!" 
     } 
    } 

    // GENERAL SETTINGS 

    var LANG_CURRENT = language; 

    var LANG_DEFAULT = 'ENG'; 

    /** 
    * All the html elements with this attributes are translated on the fly 
    */ 
    var LANG_ATTRIBUTE_NAME = "uilang" 


    /** 
    * key è la chiave da usare nell'oggetto LANG 
    * @param key 
    */ 
    this.get = function(key) 
    { 
     return Languages[LANG_CURRENT][key] || Languages[LANG_DEFAULT][key]; 
    } 

    /** 
    * Cerco tutti gli elementi che hanno una certa classe 
    */ 
    this.searchAndReplace = function() 
    { 
     var me = this; 
     var divs = $('*[' + LANG_ATTRIBUTE_NAME + ']'); 

     $.each(divs,function(indx,item) 
     { 
      item = $(item); 
      item.text(me.get(item.attr(LANG_ATTRIBUTE_NAME))); 
     }); 

    } 

    this.setLanguage = function(language, replaceText) 
    { 
     LANG_CURRENT = language; 
     if(replaceText){ 
      this.searchAndReplace(); 
     } 
    } 

    if(replaceText){ 
     this.searchAndReplace(); 
    } 

    // Returns a localized instance of language 
    Lang = { 
     get: this.get 
     ,searchAndReplace: this.searchAndReplace 
     ,setLanguage: this.setLanguage 
    }; 
} 

Para usarlo, simplemente "marca" un elemento HTML

<h1 uilang="unknown_user"></h1> 

o llame

Lang.get('unknown_user') 

para obtener la cadena localizada

Para inicializar, llame al "constructor"

new Lang("ITA", true); 

Para usarlo especificación de un lenguaje,

<script type="text/javascript" src="js/Lang.js?language=ita"></script> 
0

estoy tratando con i18next, que funciona bien para la mayoría de los reproductores después de la liberación Lateste (que permite establecer un objetivo de que el texto debe ir).

Sin embargo, aún no entiendo cómo traducir cosas generadas dinámicamente como la tabla emergente.

Aparte de eso, está funcionando muy bien.

Aquí es cómo configurarlo:

lang : function (page) { 
     var update_language, 
      translate = function (page) { 
      page.find('.t').i18n(); 
      }, 
      set_lang = function (language) { 
      var set_icon; 
      switch (language) { 
       case "de-DE": 
       set_icon = "DE"; 
       break; 
       case "fr-FR": 
       set_icon = "FR"; 
       break; 
       default: 
       set_icon = "EN"; 
       break; 
      } 
      $(".setIcon").parent(".ui-btn").find(".ui-icon") 
       .removeClass().addClass('ui-icon ui-shadow ui-icon-lang '+set_icon); 
      } 
     if (fauna.i18set === undefined) { 
      i18n.init({ 
      lng: 'en-EN', 
      load: 'current', 
      detectLngQS: 'lang', 
      fallbackLng: false, 
      resGetPath: '../lang/__lng__/__ns__.json', 
      ns: 'gen', 
       debug: true, 
      // , useLocalStorage: true 
      // , localStorageExpirationTime: 86400000 // in ms, default 1 week 
      }, function() { 
      translate(page); 
      set_lang(i18n.lng()); 
      }); 
      fauna.i18set = true; 
     } else { 
      update_language = $.mobile.path.parseUrl(window.location.href) 
      .hash.replace(/.*lang=/, ""); 
      if (update_language !== "") { 
      i18n.setLng(update_language, function() { 
       translate(page); 
       set_lang(i18n.lng()); 
      }); 
      } else { 
      translate(page); 
      } 
     } 
     } 

Así que estoy usando una clase .t para etiquetar elementos para la traducción (la clase de búsqueda es más rápida que ficha atributos).

Estoy llamando al anterior en pagebeforeshow que también parece manejar todo muy bien.

Nota: Recién notamos que el update_language fallará si el estado push está deshabilitado. Necesito una mejor expresión regular para esto.

0

Puede probar el marco HTMLed.js. Es bastante más fácil. Verifica el marco.

aquí es el link