js 实现前端国际化

不念不忘少年蓝@ 2022-02-02 05:06 353阅读 0赞

> 在之前的文章里, 我贴过 小程序的国际化方法, 这里的 方法和小程序的 基本相似, 
> 
> 但是还是有细微不同, 所以单独贴出来.

/**
     *
     * 使用方法
     *
     * 先调用 init_L 方法初始化
     *
     * 然后使用 _.XXX 或者 _['XXX'] 获取具体值
     * 
     */
    
    // 获取浏览器 缓存中的 语言
    var lang = localStorage.getItem('appLanguage')
    if(!lang){
    	//获取系统语言
    	lang = navigator.language;
    }
    
    if (lang == undefined) {
    	lang = "zh-hk";
    } else {
    	lang = lang.replace(/_/g, '-');
    }
    //将语言转为小写
    lang = lang.toLowerCase()
    
    var default_L = lang;
    
    // 两种 key : 'appTitle' 或者  'app title', 第一种  _.appTitle, 第二种: _['app title']
    var default_ = {
    	"en": {
    		'appTitle': 'H5'
    	},
    	"zh_cn": {
    		'appTitle': '网页版'
    	},
    	"zh_hk": {
    		'appTitle': '網頁版'
    	}
    }
    
    // 设置 默认语言
    var _ = default_.zh_hk;
    
    // 我这里是使用浏览器默认语言, 如果这里不调用, 则需要在引用页的js内申明.
    init_L();
    
    // 设置语言, L 不传 则获取浏览器语言
    function init_L(L) {
    	if (L != null && L != "" && L != 'undefined' && L != undefined) {
    		default_L = L;
    	}
    
    	if (default_L == "en") {
    		_ = default_.en;
    	} else if (default_L == "zh-cn") {
    		_ = default_.zh_cn;
    	} else {
    		_ = default_.zh_hk;
    	}
    }

发表评论取消回复

表情：

评论列表（有 0 条评论，353人围观）

还没有评论，来说两句吧...

相关阅读

相关实现国际化

Flutter实现国际化 [一. 国际化的认识][.] [二. 国际化的适配][. 1] [2.1. Widget的国际化][2.1. Widge

r囧r小猫/ 2023年01月16日 06:40/ 0 赞/ 205 阅读

相关 js 一分钟自动保存_前端国际化：自动管理工具

![68cbf034c67d2369a590542d8f669c0e.png][] 背景前段时间需要把一个开发了两年左右的项目进行国际化，支持中英文，逛了一圈社区都没

短命女/ 2023年01月01日 09:55/ 0 赞/ 78 阅读

相关使用react-intl，antd前端函数组件国际化实现

一、首先，添加dependencies，我使用的版本是`react-intl 2.4.0` ![在这里插入图片描述][20201117164435664.png_pic_

曾经终败给现在/ 2022年12月22日 04:43/ 0 赞/ 194 阅读

相关 SpringBoot实现国际化

一、添加国际化配置文件在resources下创建名称为i18n的文件夹，并在该文件夹中编写对应的多语言国际化文件login.properties、login\_zh\_

清疚/ 2022年11月21日 11:58/ 0 赞/ 199 阅读

相关前端时间国际化入门

> 时间只是幻觉。—— 阿尔伯特·爱因斯坦 > 最近在开发一个需要完善国际化方案的前端项目，在处理时间国际化的时候遇到了一些问题。于是花了一些时间研究，有了这篇文章。不

本是古典何须时尚/ 2022年09月16日 14:26/ 0 赞/ 396 阅读

相关 Android实现国际化

Android实现国际化国际化I18n简介 Android实现国际化 Android实现国际化国际化I18n简介

迈不过友情╰/ 2022年08月18日 05:51/ 0 赞/ 215 阅读

相关 js 实现前端国际化

> 在之前的文章里, 我贴过小程序的国际化方法, 这里的方法和小程序的基本相似, > > 但是还是有细微不同, 所以单独贴出来. /

不念不忘少年蓝@/ 2022年02月02日 05:06/ 0 赞/ 354 阅读

相关前端国际化

前言 > 从10年接触编程就开始接触国际化这个概念，然而这些年全面用到国际化的项目并不是很多，且都是些螺丝钉式的工作。15年末，部门项目需要推国际化，前端这块由我来主导。

淩亂°似流年/ 2022年01月20日 08:01/ 0 赞/ 285 阅读

相关 vis.js 头部日期实现国际化

如图：对头部实现国际化如果是英文版本则切换成英文如果是中文版本则切换成中文 ![SouthEast][] 1.需引入 <script src="${pa

太过爱你忘了你带给我的痛/ 2021年10月08日 07:02/ 0 赞/ 272 阅读

相关前端实现国际化

步骤1.引入相关的js文件 1、strings\_zh.properties (表示中文属性文件)新创 2、strings.properties

悠悠/ 2021年10月08日 06:58/ 0 赞/ 458 阅读