简繁体自动切换功能

更新时间：2020-05-26 16:12:36 作者：米拓建站

## 概述：
在中文或繁体页面通过调用系统js函数，可实现页面文字简繁体切换。
【说明】
- 简繁切换按钮功能，可参考“[简繁体自动切换](https://doc.metinfo.cn/metinfo/language/language471.html "简繁体自动切换")”开启或关闭；
- 仅适用用于中文前台语言（语言标识为`cn`或`zh`时生效），浏览者可以在简繁体之间切换。

## 使用范围：
所有模板文件都可调用，常用于`head.php`或`foot.php`中。
## 类型：
功能代码，包含html和js。
## 语法：

【说明】
- `$c['met_ch_lang']`：系统简繁切换开关，开启时值为1；
- `$data['synchronous']`：语言标识，中文或繁体语言站的语言标识分别为`cn`、`zh`。

## 示例：
### 头部导航如何调用简繁切换按钮
首先要开启简繁切换功能，简繁切换按钮功能，可参考“[简繁体自动切换](https://doc.metinfo.cn/metinfo/language/language471.html "简繁体自动切换")”开启。

#### 模板代码：
**html代码：**
然后在头部模板文件`head.php`中编写以下代码：

<if value="$c['met_ch_lang'] && ($data['synchronous'] eq 'cn' || $data['synchronous'] eq 'zh')">//通过if标签判断$c['met_ch_lang']（系统简繁切换开关）是否为1（简繁切换开关开启时），且$data['synchronous']（当前站点语言标识）是否为 'cn'或 'zh'，当这两个条件都满足时，渲染if标签包含的代码，if标签具体用法请参考文档https://doc.metinfo.cn/mb/mbtag/85.html
    <button type="button" class="btn btn-default btn-outline met-lang-cnzh" m-id="lang" m-type="lang">繁体</button>//按钮标签里的文字默认为“繁体”，按钮标签上必须加上属性m-id="lang"和m-type="lang"（可视化设置的需要）
    //给按钮标签加上自定义的类名met-lang-cnzh，供js代码调用
    </if>

【注意】实际编写时请去掉注释文字。

**js代码：**

//简体繁体互换
    ////met-lang-cnzh为html代码中自定义的类名，具体请参考上方的html代码部分
    var tsChangges=function(change){
            tsChangge(change,function(isSimplified){
                $('.met-lang-cnzh').text(isSimplified?'繁體':'简体');
            });
        };
    tsChangges();
    $('.met-lang-cnzh').click(function() {
        tsChangges(1);
    });

#### 前台页面输出HTML：

假设系统开启了简繁切换开关，当前站点语言为中文（语言标识为`cn`），则前台输出代码如下：
**html代码：**

**js代码：**
前台加载的js代码与编写的一致

文档中心

米拓学堂

帮助中心

在线交流

{"status":1,"html":"<style type=\"text\/css\">\r\n.onlinebox_three{border:2px solid;}\r\n.onlinebox_three .onlinebox_three_list{width: 160px;padding: 10px 0px;}\r\n.onlinebox_three .online-item{margin-bottom: 5px; padding: 0px 17px; position: relative;display: block;color: #666;}\r\n.onlinebox_three .online-item:last-child{margin-bottom: 0px;}\r\n.onlinebox_three .online-item:hover{background: #f8f8f8;}\r\n.onlinebox_three .online-item i{font-size: 16px;}\r\n.onlinebox_three .onlinebox-open{font-size: 22px;display:none;cursor: pointer;padding: 0 10px; font-size: 18px; line-height: 40px;}\r\n.onlinebox.min .onlinebox-open{display:block;padding:0 10px;background:#444;font-size:18px;line-height:40px;color:#fff}\r\n.onlinebox .onlinebox-min{position: relative;top:-4px;}\r\n@media (max-width: 767px){\r\n.onlinebox_three .online-item{font-size: 12px;padding-top: 6px;}\r\n.onlinebox_three .online-item i{font-size: 14px;}\r\n}\r\n<\/style>\r\n<div id='onlinebox'  class=\"onlinebox onlinebox_three hide\" m-type='online' m-id='online' style=\"border-color:#1baadb;\">\r\n    <div class=\"onlinebox-open\" style=\"background:#1baadb;\"><i class=\"fa fa-comments-o\"><\/i><\/div>\r\n    <div class=\"onlinebox-box\">\r\n        <div class=\"onlinebox-top\" style=\"background:#1baadb;\">\r\n            <div class=\"onlinebox-top-btn font-size-26\">\r\n                <a href=\"javascript:;\" class=\"onlinebox-close\" title=\"\">×<\/a>\r\n                <a href=\"javascript:;\" class=\"onlinebox-min\">-<\/a>\r\n            <\/div>\r\n            <h4>在线交流<\/h4>\r\n        <\/div>\r\n                                    <div class=\"met-editor onlinebox-bottom p-x-10 p-y-5\"><p style=\"text-align: center;\">\r\n    <img src=\"..\/upload\/202001\/1579417409303256.png\" data-width=\"120\" width=\"120\" data-height=\"120\" height=\"120\" title=\"\"\/>\r\n<\/p>\r\n<p style=\"text-align: center;\">\r\n    微信公众号\r\n<\/p>\r\n<p style=\"text-align:center;\">\r\n    <img src=\"..\/upload\/202001\/1579417452544806.png\" data-width=\"150\" width=\"150\" data-height=\"150\" height=\"150\" title=\"\"\/>\r\n<\/p>\r\n<p style=\"text-align: center;\">\r\n    QQ交流群\r\n<\/p><\/div>\r\n    <\/div>\r\n<\/div>","t":"4","x":"10","y":"130"}