release v2.8.18-rc.1 (#1399)

release v2.8.18-rc.1

CONTRIBUTING.md

@@ -1,23 +1,20 @@
 # 🍀 提 Issue 的正确方式
 
-## 标题
+## 自助
-为了保持 Issues 区域版面整洁可读， 创建 Issue 时，**标题应尽量言简意赅** （一句话概括问题）
 
-## 说明
+创建 Issue 前，为了避免议题重复而造成大家不必要的消耗，您可以先尝试通过以下渠道寻找解决方案：
 
-创建 Issue 时，**[内容请按照文本框中的文字模板规范填写（点击查看示例）](https://foruda.gitee.com/images/1660197253451887123/%E5%B1%8F%E5%B9%95%E6%88%AA%E5%9B%BE.png)**，尽量将您所遇到的问题描述详细，如：
+- 仔细查看 Layui 官方文档，大部分问题都能通过文档找到答案：https://layui.dev
+- 在 Issues 中搜索类似问题，基本上都有相关回复
 
-- **版本：** 提供所使用的 Layui 版本号。
+## 创建
-- **描述：** 提供尽可能详细的问题描述和具体操作步骤等信息，以便我们也能够更轻松地将问题复现。
-- **代码：** 提供与问题对应的业务代码，以便我们更好排查。
-- **补充：** 如若必要，还可以提供其他补充，如截图等信息。
 
-> 按照模板规范填写的初衷，是为了减少大家不必要的时间消耗，还望遵循并理解 
+若上述渠道未能找到解决方案，那么创建 Issue 时，**请按照表单模板规范逐一填写**。
+其中，标题应尽量言简意赅（一句话概括议题），其他表单项则尽量将您所遇到的问题描述详细。
 
-- **若 Issue 未遵循模板规范，可能将无法获得相关回答，敬请知晓**
+> **若 Issue 未遵循模板规范仔细填写，可能将无法获得相关回答，敬请知晓和理解**
-- 若 issue 是建议/分享/讨论性质的 ，则可以自由发挥
 
 ## 对接
 
-- 在 Issue 交流过程中，若问题已经得到解决，或 Issue 并非项目相关的问题，请及时将状态设置为 「已完成」
+- 在 Issue 交流过程中，若议题已经得到解决，或 Issue 并非项目相关问题，请在 Issue 右上角将状态设置为：已完成
-- 大家本着相互尊重、理解和友善的态度进行交流，共同维护好 Layui 来之不易的良好社区氛围。谢谢 :sparkling_heart: 
+- 大家本着相互尊重、理解和友善的态度进行交流，共同维护好 Layui 来之不易的良好的社区氛围。谢谢

docs/dropdown/detail/options.md

@@ -120,6 +120,20 @@
 
 `true`
 
+</td>
+    </tr>
+    <tr>
+<td>accordion <sup>2.8.18+</sup></td>
+<td>
+  
+是否开启手风琴效果
+
+</td>
+<td>boolean</td>
+<td>
+
+`false`
+
 </td>
     </tr>
     <tr>

docs/menu/index.md

@@ -21,6 +21,7 @@ toc: true
 
 - 通过 `<ul class="layui-menu"></ul>` 命名基础菜单容器
   - 追加 `className` 为 `layui-menu-lg` 可设置基础菜单的大尺寸风格
+  - 追加 `lay-accordion` 属性可设置手风琴效果 <sup>2.8.18+</sup>
   - 通过 `<li></li>` 放置菜单列表项
     - 属性：
       - 追加 `className` 为　`layui-menu-item-group` 可设置当前菜单为菜单组，即子菜单为纵向层级。

docs/table/detail/demo.md

@@ -1,19 +1,6 @@
 <h3 lay-toc="{level: 2, id: 'examples'}" class="layui-hide">综合演示 🔥</h3>
 
-<pre class="layui-code" lay-options="{preview: 'iframe', id: 'table-demo-1', text: {preview: '综合演示 🔥'}, style: 'height: 506px;', layout: ['preview', 'code'], tools: ['full','window'], done: function(obj){
+<pre class="layui-code" lay-options="{preview: 'iframe', id: 'table-demo-1', text: {preview: '综合演示 🔥'}, style: 'height: 506px;', layout: ['preview', 'code'], tools: ['full','window']}">
-  setTimeout(function(){
-    layer.tipsIndex = layer.tips(
-      '点击该图标可最大化查看效果', 
-      layui.$('#table-demo-1 .layui-icon-screen-full'), {
-      tips: 4,
-      time: 30*1000
-    })
-  });
-}, toolsEvent: function(oi, type){
-  if(type === 'full'){
-    layer.close(layer.tipsIndex);
-  }
-}}">
   <textarea>
 {{- d.include("/table/examples/demo.md") }}
   </textarea>

docs/versions.md

@@ -13,8 +13,8 @@ toc: true
 
 
 <h2 id="2.8.18" class="ws-anchor">
-  2.8.18-beta
+  2.8.18-rc.1
-  <span class="layui-badge-rim">2023-10-07</span>
+  <span class="layui-badge-rim">2023-10-19</span>
 </h2>
 
 - #### form
@@ -30,24 +30,32 @@ toc: true
 - #### table
   - 新增 `complete` 属性，当数据接口请求完成后执行，无论成功还是失败均会触发 # 1379
   - 修复 `ignoreExport` 表头属性值效果与文档不符的问题 # I86DBY
-  - 修复 treeTable 组件 treeTable.setRowChecked 未逐层展开上级节点的问题 # 1385/I84RUT
+- #### treeTable
+  - 修复 `treeTable.setRowChecked()` 方法未逐层展开上级节点的问题 # 1385/I84RUT
 - #### upload
-  - 修复 `unified: true` 时的报错问题
+  - 修复 `unified: true` 时的报错问题 # 1391
-  - 优化 渲染入口逻辑，以解决因重复渲染导致的若干问题
+  - 优化 渲染入口逻辑，以解决因重复渲染导致的若干问题 # 1391
-  - 优化 实例的 `reload` 方法，可更好地进行完整重载
+  - 优化 实例的 `reload` 方法，可更好地进行完整重载 # 1391
+- #### dropdown / menu
+  - 新增 `accordion` 属性，开启手风琴效果（menu: 主容器设置 `lay-accordion` 属性） # 1397
+  - 新增 折叠展开动画效果 # 1397
 - #### laydate
-  - 优化 开启 `rangeLinked` 属性后，点击目标元素可重新渲染的问题
+  - 优化 开启 `rangeLinked` 属性后，点击目标元素可重新渲染的问题 # 1391
+- #### laypage
+  - 新增 `limitTemplet` 属性，用于自定义条目模板 # I80AHZ
+  - 新增 `skipText` 属性，用于自定义跳页区域文本 # I80AHZ
 - #### carousel
   - 优化 轮播切换时的动画效果 # 1378/I82STP
 - #### rate / slider
   - 优化 代码细节 # 1374
 - #### code
-  - 新增 `code` 属性，用于设置原始 code 值，优先级高于目标元素中的内容
+  - 新增 `code` 属性，用于设置原始 code 值，优先级高于目标元素中的内容 # 1391
-  - 优化 若干小问题
+  - 优化 预览区域显示效果 # 1398
+  - 优化 其他若干小问题 # 1391
 - #### 其他
   - 优化 `<hr>` 全局样式优先级 # I86R6G
 
-### 下载： [layui-v2.8.18.1-beta.zip](https://gitee.com/layui/layui/attach_files/1553466/download)
+### 下载： [layui-v2.8.18.rc.1.zip](https://gitee.com/layui/layui/attach_files/1558085/download)
 
 ---
 

examples/laypage.html

@@ -106,6 +106,10 @@ layui.use(['laypage', 'layer'], function(){
     ,count: 100
     //,groups: 0
     ,layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip', ]
+    /*,limitTemplet: function(item) {
+      return item + ' / page';
+    }*/
+    // ,skipText: ['Go to', '', 'Confirm']
     ,jump: function(obj){
       console.log(obj)
     }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "layui",
-  "version": "2.8.18-beta.1",
+  "version": "2.8.18-rc.1",
   "description": "Classic modular Front-End UI library",
   "main": "dist/layui.js",
   "license": "MIT",

src/css/layui.css

@@ -1201,7 +1201,7 @@ body .layui-table-tips .layui-layer-content{background: none; padding: 0; box-sh
 .layui-menu li,
 .layui-menu-body-title,
 .layui-menu-body-title a{padding: 5px 15px; color: initial}
-.layui-menu li{position: relative; margin: 1px 0; line-height: 26px; color: rgba(0,0,0,.8); font-size: 14px; white-space: nowrap; cursor: pointer; transition: all .3s;}
+.layui-menu li{position: relative; margin: 0 0 1px; line-height: 26px; color: rgba(0,0,0,.8); font-size: 14px; white-space: nowrap; cursor: pointer; transition: all .3s;}
 .layui-menu li:hover{background-color: #f8f8f8; }
 .layui-menu li.layui-disabled,
 .layui-menu li.layui-disabled *{background: none !important; color: #d2d2d2 !important; cursor: not-allowed !important;}
@@ -1224,6 +1224,8 @@ body .layui-table-tips .layui-layer-content{background: none; padding: 0; box-sh
 .layui-menu .layui-menu-item-down:hover{cursor: pointer;}
 .layui-menu .layui-menu-item-up>.layui-menu-body-title{ color: rgba(0,0,0,.8);}
 .layui-menu .layui-menu-item-up>ul{visibility: hidden; height: 0; overflow: hidden;}
+.layui-menu .layui-menu-item-down>.layui-menu-body-title>.layui-icon-down{transform: rotate(180deg);}
+.layui-menu .layui-menu-item-up>.layui-menu-body-title>.layui-icon-up{transform: rotate(-180deg);}
 .layui-menu .layui-menu-item-up>.layui-menu-body-title:hover>.layui-icon,
 .layui-menu .layui-menu-item-down:hover>.layui-menu-body-title>.layui-icon{color: rgba(0,0,0,1);}
 .layui-menu .layui-menu-item-down>ul{visibility: visible; height: auto;}
@@ -1237,7 +1239,7 @@ body .layui-table-tips .layui-layer-content{background: none; padding: 0; box-sh
 .layui-menu-body-title{position: relative; margin: -5px -15px; overflow: hidden; text-overflow: ellipsis;}
 .layui-menu-body-title a{display: block; margin: -5px -15px; color: rgba(0,0,0,.8);}
 .layui-menu-body-title a:hover{transition: all .3s;}
-.layui-menu-body-title>.layui-icon{position: absolute; right: 15px; top: 50%; margin-top: -6px; line-height: normal; font-size: 14px;}
+.layui-menu-body-title>.layui-icon{position: absolute; right: 15px; top: 50%; margin-top: -6px; line-height: normal; font-size: 14px; transition: all .2s; -webkit-transition: all .2s;}
 .layui-menu-body-title>.layui-icon:hover{transition: all .3s;}
 .layui-menu-body-title>.layui-icon-right{right: 14px;}
 .layui-menu-body-panel{display: none; position: absolute; top: -7px; left: 100%; z-index: 1000; margin-left: 13px; padding: 5px 0;}

src/css/modules/code.css

@@ -51,7 +51,7 @@ html #layuicss-skincodecss{display: none; position: absolute; width: 1989px;}
 .layui-code-preview > .layui-tab > .layui-tab-title{border-width: 0;}
 .layui-code-preview .layui-code-item{display: none;}
 .layui-code-preview .layui-code-view > .layui-code-lines > .layui-code-line{}
-.layui-code-item-preview{position: relative; padding: 16px; overflow: auto;}
+.layui-code-item-preview{position: relative; padding: 16px;}
 .layui-code-item-preview > iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none;}
 
 /* 工具栏  */
@@ -66,6 +66,7 @@ html #layuicss-skincodecss{display: none; position: absolute; width: 1989px;}
 .layui-code-full .layui-code-item,
 .layui-code-full .layui-code-view,
 .layui-code-full .layui-code-wrap{height: calc(100vh - 51px) !important; box-sizing: border-box;}
+.layui-code-full .layui-code-item-preview{overflow: auto;}
 
 /* 代码高亮重置 */
 .layui-code-view.layui-code-hl{line-height: 20px !important; border-left-width: 1px;}

src/layui.js

@@ -16,7 +16,7 @@
   };
 
   var Layui = function(){
-    this.v = '2.8.18-beta.1'; // Layui 版本号
+    this.v = '2.8.18-rc.1'; // Layui 版本号
   };
   
   // 识别预先可能定义的指定全局对象

src/modules/dropdown.js

@@ -102,7 +102,8 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){
     isSpreadItem: true, // 是否初始展开子菜单
     data: [], // 菜单数据结构
     delay: 300, // 延迟关闭的毫秒数，若 trigger 为 hover 时才生效
-    shade: 0 // 遮罩
+    shade: 0, // 遮罩
+    accordion: false // 手风琴效果，仅菜单组生效。基础菜单需要在容器上追加 'lay-accordion' 属性。
   };
   
   // 重载实例
@@ -343,12 +344,12 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){
     
     // 触发菜单组展开收缩
     that.elemView.find(STR_GROUP_TITLE).on('click', function(e){
-      var othis = $(this)
+      var othis = $(this);
-      ,elemGroup = othis.parent()
+      var elemGroup = othis.parent();
-      ,data = elemGroup.data('item') || {}
+      var data = elemGroup.data('item') || {};
       
       if(data.type === 'group' && options.isAllowSpread){
-        thisModule.spread(elemGroup);
+        thisModule.spread(elemGroup, options.accordion);
       }
     });
 
@@ -442,17 +443,32 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){
   };
   
   // 设置菜单组展开和收缩状态
-  thisModule.spread = function(othis){
+  thisModule.spread = function(othis, isAccordion){
-    // 菜单组展开和收缩
     var needSpread = othis.hasClass(STR_ITEM_UP);
-    var elemIcon = othis.children('.'+ STR_MENU_TITLE).find('.layui-icon-' + (needSpread ? 'down' : 'up'));
+
-    if(needSpread){
+    var toggle = function (groupElem, isOpen) {
-      othis.removeClass(STR_ITEM_UP).addClass(STR_ITEM_DOWN);
+      var contentElem = groupElem.children('ul');
-      elemIcon.removeClass('layui-icon-down').addClass('layui-icon-up');
+      var contentHeight = contentElem[0].scrollHeight;
-    } else {
+
-      othis.removeClass(STR_ITEM_DOWN).addClass(STR_ITEM_UP);
+      if(contentElem.is(':animated')) return;
-      elemIcon.removeClass('layui-icon-up').addClass('layui-icon-down');
+
+      groupElem.removeClass(isOpen ? STR_ITEM_UP : STR_ITEM_DOWN).addClass(isOpen ? STR_ITEM_DOWN : STR_ITEM_UP);
+      contentElem.height(isOpen ? 0 : contentHeight)
+        .stop()
+        .animate({
+          opacity: isOpen ? 1 : 0, 
+          height: isOpen ? contentHeight : 0
+        }, 200, function(){
+          contentElem.css({ height: '', opacity: '' })
+        })
     }
+
+    toggle(othis, needSpread);
+
+    if (!needSpread || !isAccordion) return;
+    layui.each(othis.siblings('.' + STR_ITEM_DOWN), function(index, item){
+      toggle($(item), false);
+    })
   };
   
   // 全局事件
@@ -535,9 +551,10 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){
       var othis = $(this);
       var elemGroup = othis.parents('.'+ STR_ITEM_GROUP +':eq(0)');
       var options = lay.options(elemGroup[0]);
+      var isAccordion = typeof othis.parents('.layui-menu').eq(0).attr('lay-accordion') === 'string';
 
       if(('isAllowSpread' in options) ? options.isAllowSpread : true){
-        thisModule.spread(elemGroup);
+        thisModule.spread(elemGroup, isAccordion);
       }
     });
     

src/modules/element.js

@@ -289,19 +289,22 @@ layui.define('jquery', function(exports){
       }
       
       // 若为垂直菜单
-      if(parents.hasClass(NAV_TREE)){
+      if (parents.hasClass(NAV_TREE)) {
         var NAV_ITEMED = NAV_ITEM + 'ed';
         var NAV_EXPAND = 'layui-nav-expand';
-        var isNone = child.css('display') === 'none';
+        var needExpand = !(parent.hasClass(NAV_EXPAND) || parent.hasClass(NAV_ITEMED));
+
+        // 是否正处于动画中的状态
+        if (child.is(':animated')) return;
 
         child.removeClass(NAV_ANIM);
 
         // 若有子菜单，则展开
-        if(child[0]){
+        if (child[0]) {
           child.stop().slideToggle(200, function() {
-            isNone || parent.removeClass(NAV_ITEMED);
+            needExpand || parent.removeClass(NAV_ITEMED);
           });
-          parent[isNone ? 'addClass': 'removeClass'](NAV_EXPAND);
+          parent[needExpand ? 'addClass': 'removeClass'](NAV_EXPAND);
           // 手风琴
           if(typeof parents.attr('lay-accordion') === 'string' || parents.attr('lay-shrink') === 'all'){
             // 收缩兄弟项

src/modules/laypage.js

@@ -5,22 +5,23 @@
 layui.define(function(exports){
   "use strict";
   
-  var doc = document
+  var doc = document;
-  ,id = 'getElementById'
+  var id = 'getElementById';
-  ,tag = 'getElementsByTagName'
+  var tag = 'getElementsByTagName';
   
-  //字符常量
+  // 字符常量
-  ,MOD_NAME = 'laypage', DISABLED = 'layui-disabled'
+  var MOD_NAME = 'laypage';
+  var DISABLED = 'layui-disabled';
   
-  //构造器
+  // 构造器
-  ,Class = function(options){
+  var Class = function(options){
     var that = this;
     that.config = options || {};
     that.config.index = ++laypage.index;
     that.render(true);
   };
 
-  //判断传入的容器类型
+  // 判断传入的容器类型
   Class.prototype.type = function(){
     var config = this.config;
     if(typeof config.elem === 'object'){
@@ -54,7 +55,7 @@ layui.define(function(exports){
      // 默认条数
     config.limit = Number(config.limit) || 10;
     
-    //总页数
+    // 总页数
     config.pages = Math.ceil(config.count/config.limit) || 1;
     
     // 当前页不能超过总页数
@@ -64,73 +65,73 @@ layui.define(function(exports){
       config.curr = 1;
     }
     
-    //连续分页个数不能低于 0 且不能大于总页数
+    // 连续分页个数不能低于 0 且不能大于总页数
     if(groups < 0){
       groups = 1;
     } else if (groups > config.pages){
       groups = config.pages;
     }
     
-    config.prev = 'prev' in config ? config.prev : '&#x4E0A;&#x4E00;&#x9875;'; //上一页文本
+    config.prev = 'prev' in config ? config.prev : '&#x4E0A;&#x4E00;&#x9875;'; // 上一页文本
-    config.next = 'next' in config ? config.next : '&#x4E0B;&#x4E00;&#x9875;'; //下一页文本
+    config.next = 'next' in config ? config.next : '&#x4E0B;&#x4E00;&#x9875;'; // 下一页文本
     
-    //计算当前组
+    // 计算当前组
     var index = config.pages > groups 
       ? Math.ceil( (config.curr + (groups > 1 ? 1 : 0)) / (groups > 0 ? groups : 1) )
-    : 1
+    : 1;
     
-    //视图片段
+    // 视图片段
-    ,views = {
+    var views = {
-      //上一页
+      // 上一页
       prev: function(){
         return config.prev 
           ? '<a class="layui-laypage-prev'+ (config.curr == 1 ? (' ' + DISABLED) : '') +'" data-page="'+ (config.curr - 1) +'">'+ config.prev +'</a>'
         : '';
-      }()
+      }(),
       
-      //页码
+      // 页码
-      ,page: function(){
+      page: function(){
         var pager = [];
         
-        //数据量为0时，不输出页码
+        // 数据量为0时，不输出页码
         if(config.count < 1){
           return '';
         }
         
-        //首页
+        // 首页
         if(index > 1 && config.first !== false && groups !== 0){
           pager.push('<a class="layui-laypage-first" data-page="1"  title="&#x9996;&#x9875;">'+ (config.first || 1) +'</a>');
         }
 
-        //计算当前页码组的起始页
+        // 计算当前页码组的起始页
-        var halve = Math.floor((groups-1)/2) //页码数等分
+        var halve = Math.floor((groups-1)/2) // 页码数等分
-        ,start = index > 1 ? config.curr - halve : 1
+        var start = index > 1 ? config.curr - halve : 1;
-        ,end = index > 1 ? (function(){
+        var end = index > 1 ? (function(){
           var max = config.curr + (groups - halve - 1);
           return max > config.pages ? config.pages : max;
         }()) : groups;
         
-        //防止最后一组出现“不规定”的连续页码数
+        // 防止最后一组出现“不规定”的连续页码数
         if(end - start < groups - 1){
           start = end - groups + 1;
         }
 
-        //输出左分割符
+        // 输出左分割符
         if(config.first !== false && start > 2){
           pager.push('<span class="layui-laypage-spr">&#x2026;</span>')
         }
         
-        //输出连续页码
+        // 输出连续页码
         for(; start <= end; start++){
           if(start === config.curr){
-            //当前页
+            // 当前页
             pager.push('<span class="layui-laypage-curr"><em class="layui-laypage-em" '+ (/^#/.test(config.theme) ? 'style="background-color:'+ config.theme +';"' : '') +'></em><em>'+ start +'</em></span>');
           } else {
             pager.push('<a data-page="'+ start +'">'+ start +'</a>');
           }
         }
         
-        //输出输出右分隔符 & 末页
+        // 输出输出右分隔符 & 末页
         if(config.pages > groups && config.pages > end && config.last !== false){
           if(end + 1 < config.pages){
             pager.push('<span class="layui-laypage-spr">&#x2026;</span>');
@@ -141,49 +142,67 @@ layui.define(function(exports){
         }
 
         return pager.join('');
-      }()
+      }(),
       
-      //下一页
+      // 下一页
-      ,next: function(){
+      next: function(){
         return config.next 
           ? '<a class="layui-laypage-next'+ (config.curr == config.pages ? (' ' + DISABLED) : '') +'" data-page="'+ (config.curr + 1) +'">'+ config.next +'</a>'
         : '';
-      }()
+      }(),
       
-      //数据总数
+      // 数据总数
-      ,count: '<span class="layui-laypage-count">共 '+ config.count +' 条</span>'
+      count: '<span class="layui-laypage-count">共 '+ config.count +' 条</span>',
       
-      //每页条数
+      // 每页条数
-      ,limit: function(){
+      limit: function(){
-        var options = ['<span class="layui-laypage-limits"><select lay-ignore>'];
+        var elemArr = ['<span class="layui-laypage-limits"><select lay-ignore>'];
+        var template = function(item) {
+          var def = item +' 条/页';
+          return typeof config.limitTemplet === 'function'
+            ? (config.limitTemplet(item) || def)
+          : def;
+        };
+
+        // 条目选项列表
         layui.each(config.limits, function(index, item){
-          options.push(
+          elemArr.push(
-            '<option value="'+ item +'"'
+            '<option value="'+ item +'"'+ (item === config.limit ? ' selected' : '') +'>'
-            +(item === config.limit ? 'selected' : '') 
+              + template(item)
-            +'>'+ item +' 条/页</option>'
+            + '</option>'
           );
         });
-        return options.join('') +'</select></span>';
-      }()
 
-      //刷新当前页
+        return elemArr.join('') +'</select></span>';
-      ,refresh: ['<a data-page="'+ config.curr +'" class="layui-laypage-refresh">'
+      }(),
-        ,'<i class="layui-icon layui-icon-refresh"></i>'
-      ,'</a>'].join('')
       
-      //跳页区域
+      // 刷新当前页
-      ,skip: function(){
+      refresh: [
-        return ['<span class="layui-laypage-skip">&#x5230;&#x7B2C;'
+        '<a data-page="'+ config.curr +'" class="layui-laypage-refresh">',
-          ,'<input type="text" min="1" value="'+ config.curr +'" class="layui-input">'
+          '<i class="layui-icon layui-icon-refresh"></i>',
-          ,'&#x9875;<button type="button" class="layui-laypage-btn">&#x786e;&#x5b9a;</button>'
+        '</a>'
-        ,'</span>'].join('');
+      ].join(''),
+
+      // 跳页区域
+      skip: function(){
+        var skipText = typeof config.skipText === 'object' ? config.skipText : [
+          '&#x5230;&#x7B2C;',
+          '&#x9875;',
+          '&#x786e;&#x5b9a;'
+        ];
+        return [
+          '<span class="layui-laypage-skip">'+ skipText[0],
+            '<input type="text" min="1" value="'+ config.curr +'" class="layui-input">',
+            skipText[1]+ '<button type="button" class="layui-laypage-btn">'+ skipText[2] +'</button>',
+          '</span>'
+        ].join('');
       }()
     };
 
     return ['<div class="layui-box layui-laypage layui-laypage-'+ (config.theme ? (
       /^#/.test(config.theme) ? 'molv' : config.theme
-    ) : 'default') +'" id="layui-laypage-'+ config.index +'">'
+    ) : 'default') +'" id="layui-laypage-'+ config.index +'">',
-      ,function(){
+      function(){
         var plate = [];
         layui.each(config.layout, function(index, item){
           if(views[item]){
@@ -191,20 +210,21 @@ layui.define(function(exports){
           }
         });
         return plate.join('');
-      }()
+      }(),
-    ,'</div>'].join('');
+    '</div>'].join('');
   };
 
-  //跳页的回调
+  // 跳页的回调
   Class.prototype.jump = function(elem, isskip){
     if(!elem) return;
-    var that = this
+
-    ,config = that.config
+    var that = this;
-    ,childs = elem.children
+    var config = that.config;
-    ,btn = elem[tag]('button')[0]
+    var childs = elem.children;
-    ,input = elem[tag]('input')[0]
+    var btn = elem[tag]('button')[0];
-    ,select = elem[tag]('select')[0]
+    var input = elem[tag]('input')[0];
-    ,skip = function(){
+    var select = elem[tag]('select')[0];
+    var skip = function(){
       var curr = Number(input.value.replace(/\s|\D/g, ''));
       if(curr){
         config.curr = curr;
@@ -214,7 +234,7 @@ layui.define(function(exports){
     
     if(isskip) return skip();
     
-    //页码
+    // 页码
     for(var i = 0, len = childs.length; i < len; i++){
       if(childs[i].nodeName.toLowerCase() === 'a'){
         laypage.on(childs[i], 'click', function(){
@@ -226,7 +246,7 @@ layui.define(function(exports){
       }
     }
     
-    //条数
+    // 条数
     if(select){
       laypage.on(select, 'change', function(){
         var value = this.value;
@@ -238,7 +258,7 @@ layui.define(function(exports){
       });
     }
     
-    //确定
+    // 确定
     if(btn){
       laypage.on(btn, 'click', function(){
         skip();
@@ -246,15 +266,22 @@ layui.define(function(exports){
     }
   };
   
-  //输入页数字控制
+  // 输入页数字控制
   Class.prototype.skip = function(elem){
     if(!elem) return;
-    var that = this, input = elem[tag]('input')[0];
+
+    var that = this;
+    var input = elem[tag]('input')[0];
+
     if(!input) return;
+
+    // 键盘事件
     laypage.on(input, 'keyup', function(e){
-      var value = this.value
+      var value = this.value;
-      ,keyCode = e.keyCode;
+      var keyCode = e.keyCode;
+
       if(/^(37|38|39|40)$/.test(keyCode)) return;
+
       if(/\D/.test(value)){
         this.value = value.replace(/\D/, '');
       }
@@ -264,12 +291,12 @@ layui.define(function(exports){
     });
   };
 
-  //渲染分页
+  // 渲染分页
   Class.prototype.render = function(load){
-    var that = this
+    var that = this;
-    ,config = that.config
+    var config = that.config;
-    ,type = that.type()
+    var type = that.type();
-    ,view = that.view();
+    var view = that.view();
     
     if(type === 2){
       config.elem && (config.elem.innerHTML = view);
@@ -293,16 +320,16 @@ layui.define(function(exports){
     that.skip(elem);
   };
   
-  //外部接口
+  // 外部接口
   var laypage = {
-    //分页渲染
+    // 分页渲染
     render: function(options){
       var o = new Class(options);
       return o.index;
-    }
+    },
-    ,index: layui.laypage ? (layui.laypage.index + 10000) : 0
+    index: layui.laypage ? (layui.laypage.index + 10000) : 0,
-    ,on: function(elem, even, fn){
+    on: function(elem, even, fn){
-      elem.attachEvent ? elem.attachEvent('on'+ even, function(e){ //for ie
+      elem.attachEvent ? elem.attachEvent('on'+ even, function(e){ // for ie
         e.target = e.srcElement;
         fn.call(elem, e);
       }) : elem.addEventListener(even, fn, false);