前端国际化,用jquery.i18n完成中英文切换


顾名思义,用jquery.i18n首先需要引入jquery。

头部文件如下

<script src="/assets-new/plugins/jquery/jquery.min.js"></script>

<script src="/assetsnew/jquery.i18n.js"></script>
<script src="/assetsnew/lang-en.js"></script>//英文js

主要内容:

<ol class="breadcrumb">
      <li class="breadcrumb-item" id="ex1">你好</li>
       <li class="breadcrumb-item active" id="ex2">欢迎</li>
</ol>
lang-en.js如下:

	i18n_dict = {
		"你好": "hellow",
		"欢迎": "welcome",

	};
	$.i18n.load(i18n_dict);
	var en = function(event) {
		//		公共部分
		$('#ex1')._t('你好');
		$('#ex2')._t('欢迎');
		
	};
	$('#translate_button').click(function () {//点击按钮时进行语言切换
		en();		
	});

思路扩展:想下次进来还是上一次选择的语言可以加一个cookie

优点:在进行语言切换时,速度很快,不会进行页面刷新。适合静态页面使用。

缺点:当页面中有动态注入的内容时可能会出现翻译不了的情况。每个需要翻译的地方都要加一个id或class,比较麻烦。





  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值