通过js实现静态切换国际化页面

最新推荐文章于 2023-08-24 08:24:05 发布

星空下的夜语

最新推荐文章于 2023-08-24 08:24:05 发布

阅读量492

点赞数

分类专栏：前端知识

本文链接：https://blog.csdn.net/sy1277590639/article/details/102522812

版权

前端知识专栏收录该内容

5 篇文章 0 订阅

订阅专栏

前端代码：

<div>
                    <a id='lang-hk' href=''>
                        简体
                    </a> |
                    <a id='lang-cn' href=''>
                        繁体
                    </a> |
                    <a id='lang-us' href=''>
                        英语
                    </a>
</div>

jq代码部分:

<script>
$(document).ready(function() {
//获取当前页面名称
var strUrl=window.location.href;
var arrUrl=strUrl.split("/");
var strPage=arrUrl[arrUrl.length-1];
if(strPage.indexOf("?")>-1){
    var pageName=strPage.split("?");
    strPage=pageName[0];
}
})
//绑定点击事件
$('#lang-hk').on('click',function{
$('#lang-hk').attr('href' , ‘../hk’+ strPage)
})
$('#lang-cn').on('click',function{
$('#lang-cn').attr('href' ,  ‘../hk’+strPage)
})
$('#lang-us').on('click',function{
$('#lang-us').attr('href' , ‘../us’+strPage)
})
</script>

目录结构为如下所示
在这里插入图片描述
通过切换路劲达到页面静态切换语言