More 查看更多

使用说明

当文字较多或者空间较小的条件下，通常会折叠更多文字，末尾以“查看更多”结尾。

使用axMore属性即可使用插件，对块状元素和行内元素均有效。默认显示60个字，简单使用length属性可以控制显示字数。

                            <div axMore='length:60'>文字</div>

中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。

JS调用

另外用户可通过js进行参数设置。根据自己需要设置字符长度，除了字符长度之外还可以设置“更多”按钮的文字和样式，使用方法如下:

                            <script type="javascript">
                            let instance = new axMore('#id',{
                                length: 60,
                                textFold: '展开',
                                textUnfold: '收起',
                                classFold: 'ax-color-primary',
                                classUnfold: 'ax-color-primary',
                            });
                            </script>

更新参数

本插件可使用update方法更新参数，支持回调函数（无参数，可省略）。更新

JS HTML

            var paraInstance = new axMore('#para');
            var btnPara = document.querySelector('#btnPara');
            btnPara.onclick = function () {
                paraInstance.update({
                    length: 80,
                    textFold: 'More',
                    textUnfold: 'Close',
                }, function () {
                    alert('更新了！');
                });
            }

                                            <div id="update">
                                                中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。
                                            </div>

更新内容

如果插入异步内容，可使用updateContent方法初始化插件，第一个参数是传入更新的内容，可以是以下三种方式：

1、id。可以是页面中的id，填写id后将获取该id下dom的内容。格式："#id"
2、字符串。纯文本字符串作为参数传入。格式："abc123"
3、DOM。可以是页面的节点对象。格式："document.querySelector('#id')"

第二个参数是该方法的回调函数，该回调函数无参数，可省略。更新

JS HTML

                                            var contentInstance = new axMore('#content');
                                            contentInstance.updateContent('中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。', function () {
                                                alert('更新了！');
                                            });

                                            <div id="update">
                                                中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。
                                            </div>

监听方法

本插件有若干监听方法，以on为关键字，实例后监听和在参数中监听效果相同。基本写法是：instance.on('load',function(){})；具体事件说明如下：

load：初始化渲染完成执行
fold：折叠后执行
unfold：展开后执行
updated：更新了内容或参数后执行

JS HTML

                                            var onInstance = new axMore('#on');
                                            onInstance.on('unfold',function(){
                                                alert('已经展开！');
                                            }).on('fold',function(){
                                                alert('已经折叠！');
                                            });

                                            <div id="on">
                                                中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。
                                            </div>

销毁实例

使用destroy方法可销毁实例，支持回调函数（无参数，可省略）。销毁

JS HTML

            var destroyInstance = new axMore('#destroy');
            var btnDestroy = document.querySelector('#btnDestroy');
            btnDestroy.onclick = function () {
                destroyInstance.destroy(function () {
                    alert('实例销毁了！');
                });
            }

                                            <div id="destroy">
                                                中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。
                                            </div>

参数选项

document.addEventListener("DOMContentLoaded", function() {
      var demo1 = new axMore('#id',{
        insName: '',//实例名称，字符串格式；如果填写了实例名称，那么该实例会被添加到实例合集当中，通过axInstance方法可获取本实例，详细请查看：ax-utils-instance.php
        length: 60,//文字数量，默认60个字
        textFold: '展开',//按钮展开状态文字
        textUnfold: '收起',//按钮折叠状态文字
        classFold: 'ax-color-primary',//按钮折叠状态className
        classUnfold: 'ax-color-primary',//按钮展开状态className
      });
});

以axMenu插件为例，如果在元素上通过ax*使用属性，需要使用类似json的写法，属性不需要使用引号，如果值是字符串需要使用引号包裹，如果值是数字、布尔值、null或undefined不需要引号；比如要设置active，那么在元素的ax*属性中应该这样书写：axMenu="active:2"