jQuery i18n Translation Plugin

9 Comments Published February 21st, 2008 in Japanese, Javascript, Programming, Web, jQuery

I’ve recently had to do some translation on the client-side using JavaScript, and wrote this plugin to do it (based heavily on javascript i18n that almost doesn’t suck by Marcus).

Download jquery.i18n.js.

To try it out, download the sample files , or check them out using subversion :

svn co http://svn.recurser.com/misc/jquery/i18n/

The index.html file should be fairly self-explanatory… before you do any translation you have to initialise the plugin with a ‘dictionary’ (basically a property list mapping keys to their translations).

var my_dictionary = { 
    "some text"  : "a translation",
    "some more text"  : "another translation"
}
$.i18n.setDictionary(my_dictionary);

Once you’ve initialised it with a dictionary, you can translate strings using the $.i18n._() function, for example :

$('div#example').text($.i18n._('some text'));

If you want a solution that’s a bit more global, Keith Wood has written a localisation plugin that looks very nice (i haven’t actually tried it).

Search

9 Responses to “jQuery i18n Translation Plugin”

rss trackback

1 strony internetowe wroc?aw 2008/09/26 04:01

very interesting site, many useful and helpful informations, really good item, thx so mutch
2 dave 2008/10/02 01:12

^ thanks!
3 amber shop 2009/03/02 13:29

great post!!
4 Mike Nicholson 2009/05/21 13:44

Good work on this very simple jquery implementation of i18n. Often simple is best.

I’m planning to use it on a Grails project I’m working on.

Please continue to post cool stuff like this for us lazy developers :)
5 johan 2009/08/26 17:01

Nice work – this has helped me.

I found your example code shown here does not work unless the dictionary is named “i18n_dict” – not “my_dictionary” – this seems to be due to name collision in your plugin in the setDictionary(i18n_dict) function. Changing the parameter name to somethign other than “i18n_dict” solves it:

setDictionary: function(i18n_dictionary) {
i18n_dict = i18n_dictionary;
}
6 johan 2009/08/26 17:56

Version of your plug-in here solves the dictionary problem – scope to “this” – http://github.com/wynst/jquery-18n-translate/tree/master
7 ege madra 2009/10/08 15:37

Thanks for such a nice plugin. I used it in a significant project. However;

setDictionary: function(i18n_dict) {
i18n_dict = i18n_dict;
},

part of the code doesn’t work, it should be

setDictionary: function(i18n_dict) {
this.i18n_dict = i18n_dict;
},

Having changed this, I also needed to correct _ function accordingly, ie, by adding “this.” in front of i18n_dict references.
8 roses delivery 2010/01/23 12:16

well done, good job!

1 Auto Translate Website Interface using JQuery-i18n « wynst Pingback on Mar 11th, 2009 at 8:57 pm

recurser

Search

9 Responses to “jQuery i18n Translation Plugin”

Leave a Reply