基于jQuery 之前端國(guó)際化 i18n

HTML代碼

<body>
<select id="language1">
<option value="zh" selected>中文</option>
<option value="en">English</option>
</select>
<div id="en" data-locale="woshia">我是我是啊</div>

<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/jquery.i18n.properties.js"></script>
<script src="js/language.js"></script>
</body>

js代碼

$(function () {
var jsonData = {'lg': ''};
var str = jsonData.lg;
var hh = localStorage.getItem('key');

//localStorage 沒(méi)有key什么都不干
if (!hh) {
    return;
} else {
    //改變復(fù)選框的值,,,不是option
    $('#language1').val(hh);
    change()
}

});
// 復(fù)選框改變事件
$('#language1').change(function () {
//封裝的放法,每當(dāng)chang這個(gè)select下拉選項(xiàng)時(shí)候都會(huì)調(diào)用 chang方法 把選中的 val 存到localStorage
change()
});
//change 封裝成一個(gè)方法
function change() {
NaLanguage = $('#language1').val(); //獲取選中的語(yǔ)言 zh en

// 把獲取選中的 val 賦值給str
str = NaLanguage;
//tsr 存到 localStorage
localStorage.setItem('key', str);


$.i18n.properties({
    name: 'strings',  //配置文件名部分
    path: 'i18n/',    //排位置文件坐在文件位置
    mode: 'map',
    language: NaLanguage,  //對(duì)應(yīng)選擇的配置文件
    callback: function () {
        $('[data-locale]').each(function () {
            $(this).html($.i18n.prop($(this).data('locale')));
        });
    }
});

}

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容