i18next实现前端页面国际化多语言

代码记录：

//js
$(document).ready(function() {
    i18n.init({
        resGetPath: './locales/__lng__/__ns__.json'
    }, function(t) {
        // 加载默认语言
        $('body').i18n();
    });
    $("#jumpMenu").change(function(){
        i18n.init({
            resGetPath: './locales/__lng__/__ns__.json',
            lng : $("#jumpMenu").val()
        }, function(t) {
            $('body').i18n();
        });
    });
});

//html
<h1 data-i18n="title"> </h1>
<img src="" data-i18n="[src]flag" alt=""/>
<button data-i18n="button.english" id="en">en </button>
<button data-i18n="button.chinese" id="zh">中文 </button>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/i18next/1.6.3/i18next-1.6.3.min.js"></script>

//en json  位置/locales/en/translation.json
{
  "title": "title",
  "button": {
    "chinese": "chinese",
    "english": "english"
  },
  "flag": {
    "italian": "img/en.jpg"
  }
}
//zh json   位置/locales/en/translation.json
{
  "title": "标题",
  "button": {
    "chinese": "中文",
    "english": "中文"
  },
  "flag": {
    "italian": "img/zh.jpg"
  }
}