web前端,多语言切换,data-localize,
demo:
链接:https://pan.baidu.com/s/1zhFHTv4P_epbBfpiggVDXg
提取码:aqts
要想有效果,必须发布在服务器上,可以在IIS上测试。
我只用到了中文和英文,想多语言的,就自己添加语言包
把select选择的语言也存在cookie中,刷新页面,也会记住选择
<select id="ddlSomoveLanguage" onchange="chgLang();">
<option value="zh">中文</option>
<option value="en">ENGLISH</option>
</select>
language_cookie.js
var name = "somoveLanguage";
/*server*/
var ctx = window.document.location.href.substring(0, window.document.location.href.indexOf(window.document.location.pathname)); function chgLang() {
var value = $("#ddlSomoveLanguage").children('option:selected').val();
$('#ddlSomoveLanguage option:selected').text();
SetCookie(name, value);
//location.reload();
}
function SetCookie(name, value) {
var Days = 30; //此 cookie 将被保存 30 天
var exp = new Date(); //new Date("December 31, 9998");
exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000);
document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString() +";path=/";
}
function getCookie(name)//取cookies函数
{
var arr = document.cookie.match(new RegExp("(^| )" + name + "=([^;]*)(;|$)"));
if (arr != null) {
return unescape(arr[2])
} else {
return null;
}
}
var optionList = $("#ddlSomoveLanguage option");
var optionLength = optionList.length;
// 画面加载的时候,执行方法
window.onload = function () {
// 获得cookie,如果没有,默认为 zh
var value = getCookie(name);
value = value == undefined ? "zh" : value;
for (var i = 0; i < optionLength; i++) {
// 匹配 value,如果相同 value 则 selected 选中
if (optionList[i].value == value) {
optionList[i].selected = "selected";
}
}
}
//console.log(getCookie(name));
$(function () {
var uulanguage = (navigator.language || navigator.browserLanguage).toLowerCase();
if (uulanguage.indexOf("en") > -1) {
$("[data-localize]").localize("text", { pathPrefix: ctx + "/Content/lang", language: "en" });
} else if (uulanguage.indexOf("zh") > -1) {
$("[data-localize]").localize("text", { pathPrefix: ctx + "/Content/lang", language: "zh" });
} else {
$("[data-localize]").localize("text", { pathPrefix: ctx + "/Content/lang", language: "zh" });
};
if (getCookie(name) != "") {
if (getCookie(name) == "zh") {
$("[data-localize]").localize("text", { pathPrefix: ctx + "/Content/lang", language: "zh" });
}
if (getCookie(name) == "en") {
$("[data-localize]").localize("text", { pathPrefix: ctx + "/Content/lang", language: "en" });
}
} });
web前端,多语言切换,data-localize,的更多相关文章
- web网页多语言的实现方案_前端实现多语言切换
实现的效果 需要在web中实现多语言的切换,当用户语言切换完成后下次重新打开网页,也是上次设置的语言进行显示. 资源网站搜索大全https://55wd.com 实现步骤 1.在用户点击切换语言后,把 ...
- vue 双语言切换中,data内翻译文字不正常切换的解决方案
背景 有这么一个登录页面,相关功能如下: 支持双语言,点击切换语言 表单内部有一个自定义的select,里面option的label.value都是的名字由外部提供:其中预设的option的label ...
- 【理论面试篇】收集整理来自网络上的一些常见的 经典前端、H5面试题 Web前端开发面试题
##2017.10.30收集 面试技巧 5.1 面试形式 1) 一般而言,小公司做笔试题:大公司面谈项目经验:做地图的一定考算法 2) 面试官喜欢什么样的人 ü 技术好. ...
- Web前端开发推荐阅读书籍、学习课程下载
转自http://www.xuanfengge.com/fe-books.html 前言 学校里没有前端的课程,那如何学习JavaScript,又如何使自己成为一个合格的前端工程师呢? 除了在项目中学 ...
- Web前端理论知识记录
Web前端理论知识记录 Elena· 5 个月前 cookies,sessionStorage和localStorage的区别? sessionStorage用于本地存储一个会话(session) ...
- Web前端错题模糊题记录
title: Web前端错题模糊题记录 toc: true date: 2018-09-20 10:04:36 categories: Web tags: HTML CSS JavaScript HT ...
- Web 前端开发精华文章推荐(jQuery、HTML5、CSS3)【系列十二】
2012年12月12日,[<Web 前端开发人员和设计师必读文章>系列十二]和大家见面了.梦想天空博客关注 前端开发 技术,分享各种增强网站用户体验的 jQuery 插件,展示前沿的 HT ...
- 也许你需要点实用的-Web前端笔试题
之前发的一篇博客里没有附上答案,现在有空整理了下发出来,希望能帮助到正在找工作的你,还是那句话:技术只有自己真正理解了才是自己的东西,共勉. Web前端笔试题 Html+css 1.对WEB标准以及w ...
- Web前端上万字的知识总结
下面是自己学HTML+DIV+CSS+JS时的学习笔记,给大家分享以下,相互学习.大二时候寒假在家无聊的时候想做点事,总结了一下web前端基础的东西,下面的每个字都是自己手敲的. 1.<html ...
- web前端基础知识总结
上个寒假总结的web前端的一些知识点给大家分享一下 1.<html>和</html> 标签限定了文档的开始和结束点. 属性: (1) dir: 文本的显示方向,默认是从左向右 ...
随机推荐
- 开发app前需要提前准备的资料
需要准备的资料整理如下: 1 域名未注册,建议在 阿里云注册:https://www.aliyun.com/,2 服务器https://ecs-buy.aliyun.com/配置:计费方式:包年包月地 ...
- 分析轮子(五)- Vector.java
注:玩的是JDK1.7版本 一: 先上类图,从类图上看和 ArrayList.java 非常相像,可查看 分析轮子(一)-ArrayList.java 二:然后看源码,发现和 ArrayList.ja ...
- C#反射实现 C# 反射 判断类的延伸类型 使用代码生成工具Database2Sharp快速生成工作流模块控制器和视图代码 C# ADO.NET的SqlDataReader对象,判断是否包含指定字段 页面中添加锚点的几种方式 .net 简单实用Log4net(多个日志配置文件) C# 常用小点
C#反射实现 一.反射概念: 1.概念: 反射,通俗的讲就是我们在只知道一个对象的内部而不了解内部结构的情况下,通过反射这个技术可以使我们明确这个对象的内部实现. 在.NET中,反射是重要的机制, ...
- .NET领域最为流行的IOC框架之一Autofac WebAPI2使用Autofac实现IOC属性注入完美解决方案 AutoFac容器初步
.NET领域最为流行的IOC框架之一Autofac 一.前言 Autofac是.NET领域最为流行的IOC框架之一,微软的Orchad开源程序使用的就是Autofac,Nopcommerce开源程 ...
- ios调试-查看日志
连上mac,然后打开“console.app”, 左侧设备里选这个设备.
- Syncfusion SfDataGrid 导出Excel
var options = new ExcelExportingOptions { ExcelVersion = ExcelVersion.Excel2013, }; //不需要导出的字段 optio ...
- elasticsearch 二、elasticsearch-head安装
简介 elastricsearch-head是用于elasticsearch群集浏览和交互的插件. 源码:https://github.com/mobz/elasticsearch-head (上图来 ...
- Oracle分析函数-keep(dense_rank first/last)
select * from criss_sales where dept_id = 'D02' order by sale_date ; 此时有个新需求,希望查看部门 D02 内,销售记录时间最早,销 ...
- Netty HTTP 服务端入门开发
一. HTTP 简介 HTTP(超文本传输协议) 协议是建立在 TCP 传输协议之上的应用层协议,它的发展是万维网协会和 Internet 工作小组和 IETF 合作的结果. HTTP 是一个属于应用 ...
- MTK 音量加减键修改为默认控制媒体音量
frameworks/base/media/java/android/media/AudioService.java: private int getActiveStreamType(int sugg ...