摘要:本篇jQuery教程探讨了jQuery i18n实现语言切换,希望阅读本篇文章以后大家有所收获,帮助大家对jQuery的理解更加深入。
现在网站的国际化越来越重要,为此特地学习了一下i18n。可以实现中英文切换。
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<ul class="nav">
<li>
<a href="#" data-i18n="nav.home">你好</a>
</li>
<li>
<a href="#" data-i18n="nav.page1">你好</a>
</li>
<li>
<a href="#" data-i18n="nav.page2"></a>
</li>
<input data-i18n="[value]nav.button" type="button" value="查询" id="" />
<input type="text" name="" id="" data-i18n="[placeholder]nav.input" placeholder="请输入名称" />
<button id="Chinese">中文/button>
<button id="English">英文</button></ul><script src="https://code.jquery.com/jquery-3.3.1.min.js"></script><script src="./common/i18next.js"></script><script type="text/javascript">
$(function () {
var lang = 'zh-cn';
var langPath='./common/translationC.json';
changeLang('en-US');
$('#Chinese').on('click',function(){changeLang('zh-cn')});
$('#English').on('click',function(){changeLang()});
function changeLang(langtype){
langPath=langtype=='zh-cn'?'./common/translationC.json':'./common/translationE.json'
$.i18n.init({
lng: lang,
resGetPath: langPath
}, function (err, t) {
$('[data-i18n]').i18n(); // 通过选择器集体翻译
})
}
$("#btn_change").click(changeLang('zh'))
})
</script>
</body></html>
本文由职坐标整理并发布,希望对同学们有所帮助。了解更多详情请关注职坐标WEB前端jQuery频道!
您输入的评论内容中包含违禁敏感词
我知道了
请输入正确的手机号码
请输入正确的验证码
您今天的短信下发次数太多了,明天再试试吧!
我们会在第一时间安排职业规划师联系您!
您也可以联系我们的职业规划师咨询:
版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
沪公网安备 31011502005948号