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,如果没有,默认为 zhvar 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" });}} });

转载于:https://www.cnblogs.com/quitpoison/p/10183996.html

web前端,多语言切换,data-localize,相关推荐

  1. web前端开发语言介绍

    web前端开发语言主要包含:html语言,css样式代码,javascript脚本,html5,css3,jQuery,ajax,Bootstrap,Backbone 1.html语言:网页的基本标记 ...

  2. web系统多语言切换

    1,下载语言切换所需要的js  jquery.localize.js      http://webscripts.softpedia.com/script/Modules/jQuery-Plugin ...

  3. web系统多语言切换(中文,英文,日文)

    1,下载语言切换所需要的js  jquery.localize.js      http://webscripts.softpedia.com/script/Modules/jQuery-Plugin ...

  4. js-web前端-多语言切换-data-localize

    html <!DOCTYPE html> <html> <head><meta http-equiv="Content-Type" con ...

  5. web前端中快速切换图片实现视频播放效果

    在前端界面中有video组件可以直接播放下载到的视频,也可以通过video.js来显示rtmp等流媒体,实现实时画面的效果.当我们为了保证实时的效果,在将实时视频进行一帧一帧的检测之后,再合成视频,然 ...

  6. 040_初识 web 前端 HTML 超文本标记语言

    文章目录 1. web前端开发技术 2. HTML 页面结构 3. HTML 标签 3.1 文本标签 3.2 换行标签 3.3 列表标签 3.3 div 和 span 标签 3.4 图片标签 3.5 ...

  7. web前端知识点太多_web前端入门必学的16个知识点,都来看一下吧

    1.HTML常用标签 语言是什么 .Web前端开发语言. HTML超文本标记语言 . 网页主体结构 .常用标签.超链接(a标签).Img图片标签 2.盒子模型 初探Div盒子模型 .css样式. 简单 ...

  8. 全栈修炼:如何从Web前端迈向全栈开发

    前言 为什么要向全栈发展? 全栈开发是所有Web开发者的终极梦想,无论你现在是前端开发还是后端开发.并且随着大量开发者的涌入,前端和后端岗位都面临者激烈的竞争,全栈已经不是加分项,越来越成为必须项.如 ...

  9. 有关WEB前端中的语义化

    作天在变卖大学书籍时也不晓得怎么的就想起语义化这个概念,于是乎也就花点时间搞搞它.语义化标记对于刚学web前端脚本语言的童鞋来说往往都没太 在意,哇哈哈,其实我也就算只比较老的菜鸟而已,本文不是说教, ...

  10. 分享Web前端开发常用的6种编程语言及其优势!

    Web前端是互联网时代软件产品研发中不可缺少的一种专业研发角色.从狭义上讲,Web前端工程师使用HTML.CSS.Java等专业技能和工具将产品UI设计稿实现成网站产品,涵盖用户PC端.移动端网页,处 ...

最新文章

  1. mysql top 语句简介
  2. 计算机丢失tlps,win7系统下PS提示计算机丢失tlpsplib10.dll文件的解决方法
  3. cve-2020-0796_SMBGhost 漏洞 CVE20200796 的PoC 已发布,攻击现身
  4. C/C++各种系统开发环境搭建
  5. c语言中申请内存并初始化,c语言中结构体的定义、初始化及内存分配
  6. Vijos P1974 金币【数列】
  7. Android Studio一直显示Building“project name”Gradle project info问题详解
  8. 经典详细的Struts2教程(附案例源码)
  9. 如何在固定时间自动刷新网页?
  10. Gspace简介 | 华为手机如何简单使用谷歌服务
  11. 复习JQuery validate验证规则
  12. 网站域名被拦截,网站被流量劫持,服务器攻击,网站被跨区恶意点击,问题的定义与解答
  13. windows x86和x64的区别
  14. Cell子刊:成年同卵双胞胎的病毒组多样性与肠道微生物组多样性相关
  15. 计算机老师中专教学论文,职业中专计算机教学思考论文
  16. java时间格式化与格式
  17. 手持弹幕android制作,手持弹幕LED字幕屏
  18. 从 Airflow 到 Apache DolphinScheduler,有赞大数据开发平台的调度系统演进
  19. 机器学习与人工智能资源库
  20. Python写图片格式批量处理工具!你还一张一张转格式吗?

热门文章

  1. 《打造高绩效团队》读书笔记
  2. 所有游戏类型简称的意思
  3. Tensorflow keras入门教程
  4. (信号灯七)综合版本-使用HSV颜色空间将类绿色、红色和黄色区域分别二值化
  5. HTML调用Java函数或语句,在动态THML语句中调用JS函数传递带空格参数的问题
  6. logcat查询日志
  7. AI绘图实战(一):制作购物车图标icon | Stable Diffusion成为设计师生产力工具
  8. SEO大神: 百度快速SEO之网站标题怎么取
  9. CentOS7 安装Samba
  10. VBA编程图表(二十一)