使用jQuery整合Google翻譯

標籤：des   http   java   color   使用   width   

利用jQuery，輕鬆將google翻譯整合到你的web應用中。

1. [代碼][JavaScript]代碼     
?
1<script src="Scripts/TranslatorScript.js" type="text/javascript"></script>
?
2 [代碼]LoadScript,設定路徑     
?
?1LoadScript(scriptPath + "jQuery-BlockUI.js");
2LoadScript(scriptPath + "jquery.translate-1.4.7.min.js");
3LoadScript(scriptPath + "jquery.cookie.js");       

?3. [代碼][JavaScript]代碼     
01function getScriptsPath() {
02    var scripts = document.getElementsByTagName("script");
03    var regex = /(.*\/)TranslatorScript/i;
04    for (var i = 0; i < scripts.length; i++) {
05        var currentScriptSrc = scripts[i].src;
06        if (currentScriptSrc.match(regex))
07            return currentScriptSrc.match(regex)[1];
08    }
09 
10    return null;
11}
4. 代碼]loadTranslator   

01function loadTranslator() {
02 
03    $.translate(function() {
04 
05        try {
06            $(‘#translate-bar‘).html("");
07        }
08        catch (e) {
09        }
10 
11        var selectedLanguage = $.cookie(‘selectedLanguage‘); //get previously translated language
12 
13        if (selectedLanguage) {
14            if(selectedLanguage != ‘en‘)
15                translateTo(selectedLanguage);
16        }
17 
18        function translateTo(selectedLanguage) {
19            $(‘body‘).translate(‘english‘, selectedLanguage, {
20                not: ‘.jq-translate-ui‘,
21                fromOriginal: true,
22                start: function() {
23                    $(‘#jq-translate-ui‘).val(selectedLanguage);
24                    $.blockUI.defaults.applyPlatformOpacityRules = false;
25                    $.blockUI(
26                            {
27                                message: ‘Language Translation In Progress, Please Wait...‘,
28                                css:
29                                {
30                                    border: ‘none‘,
31                                    padding: ‘10px‘,
32                                    backgroundColor: ‘#000‘,
33                                    ‘-webkit-border-radius‘: ‘9px‘,
34                                    ‘-moz-border-radius‘: ‘9px‘,
35                                    opacity: .9,
36                                    color: ‘#fff‘
37                                },
38                                overlayCSS: { backgroundColor: ‘#000‘, opacity: 0.6, ‘-moz-opacity‘: ‘0.6‘, width: ‘100%‘, height: ‘100%‘ }
39                            });
40                },
41                complete: function() { $.unblockUI({ css: { cursor: ‘default‘} }); }
42            });
43        }
44    // Languages are loaded into the selection box 
45        $.translate.ui({css3特效
46            tags: ["select", "option"],
47            //a function that filters the languages:
48            filter: $.translate.isTranslatable, //this can be an array of languages/language codes too
49            //a function that returns the text to display based on the language code:
50            label: $.translate.toNativeLanguage ||http://www.huiyi8.com/css3/?
51                function(langCode, lang) { return $.translate.capitalize(lang); },
52            //whether to include the UNKNOWN:"" along with the languages:
53            includeUnknown: false
54            }).change(function() {
55            $.cookie(‘selectedLanguage‘, $(this).val(), { path: ‘/‘ });
56            translateTo($(this).val());
57            return true;
58        }).appendTo(‘#translate-bar‘);
59    });
60}