使用i18翻译库翻译警报消息

时间:2015-10-05 11:03:48

标签: javascript jquery internationalization i18next

我编写了一个代码,用于将文本从en-US翻译为id-ID(印度尼西亚语)。这里的按钮有一个文本,显示为Click me if you are serious。应用翻译后,它会成功翻译为Klik saya jika anda serius。如果单击该按钮,将显示如下警告消息:You have been alerted, code it down。我希望将该警报消息转换为id-ID。这是我的代码:

<!DOCTYPE html>
<html>

<head>
    <title>Translation</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body>
    <button onclick="alertbox();" id="btn" >Click me if you are serious</button>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="i18next-1.10.1.min.js"></script>
    <script>
    function alertbox () {
      alert("You have been alerted, code it down");
    }
    $.i18n.init({
        lng: 'id-ID',
        ns: {
            namespaces: ['ns.common', 'ns.special'],
            defaultNs: 'ns.special'
        },
        useLocalStorage: false,
        debug: true
    }, function(t) {
        $('#btn').text($.t('app.btn', {
            btn: ''
        }))
    });


    </script>
</body>

</html>  

id-ID (ns.special.json)

{
    "app": {
        "btn": "Klik saya jika anda serius"
    }
}  

en-US (ns.special.json)

{
    "app": {
        "btn": "Click me if you are serious"
    }
}  

如何将提醒讯息翻译成id-ID

2 个答案:

答案 0 :(得分:0)

你的问题在哪里?你甚至不尝试:)有记录的一切: http://i18next.com/pages/doc_jquery.html 你可以用jquery找到很多例子。您甚至可以在jsfiddle上找到实时示例,例如:

$(document).ready(function () {
i18n.init({
    "lng": 'en',
    "resStore": resources,
    "fallbackLng" : 'en'
}, function (t) {
    $(document).i18n();
});

$('.lang').click(function () {
    var lang = $(this).attr('data-lang');
    i18n.init({
        lng: lang
    }, function (t) {
        $(document).i18n();
    });
});
});

http://jsfiddle.net/SalvadorDali/dLc7x/

完成代码并编辑您的问题,以便我们为您提供帮助。首先声明i18n变量,然后使用$ .t

答案 1 :(得分:0)

我的代码:

<!DOCTYPE html>
<html>

<head>
    <title>Translation</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="test.css">
</head>

<body>
    <button id="btn">Click me if you are serious</button>
    <div id="qwe"></div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="i18next-1.10.1.min.js"></script>
    <script>
    /*$("#btn").click(function() {
        alert("You have been alerted, code it down!!!");
    });*/
    $.i18n.init({
        lng: 'en-US',
        ns: {
            namespaces: ['ns.common', 'ns.special'],
            defaultNs: 'ns.special'
        },
        useLocalStorage: false,
        debug: true
    }, function(t) {
        var key = $('#qwe').text();
        $('#btn').text($.t('app.btn', {
            btn: ''
        }))
        $('#qwe').text($.t('app.alert', {
          alert: ''
        }))
    });
    $("#btn").click(function() {
        alert($('#qwe').text());
    });
    </script>
</body>

</html>  

CSS:

div {
    display: none;
}  

ns.special.json(zh-CN):

{
    "app": {
        "btn": "Click me if you are serious",
        "alert": "You have been alerted, code it down!!!"
    }
}  

ns.special.json(id-ID):

{
    "app": {
        "btn": "Klik saya jika anda serius",
        "alert": "Anda telah diperingatkan, kode itu turun!!!"
    }
}