2.0.2

CHANGELOG.md

@@ -1,4 +1,5 @@
 
 # 更新日志
+* [2.0.2](http://www.layui.com/doc/base/changelog.html#2-0-2)
 * [2.0.1](http://www.layui.com/doc/base/changelog.html#2-0-1)
 * [2.0.0](http://www.layui.com/doc/base/changelog.html#2-0-0)

src/css/layui.css

@@ -78,9 +78,16 @@ a cite{font-style: normal; *cursor:pointer;}
 .layui-layout-left{position: absolute !important; left: 200px; top: 0;}
 .layui-layout-right{position: absolute !important; right: 0; top: 0;}
 
+/* 响应式类 */
+.layui-hide-xs{display: none!important;}
+.layui-show-xs-block{display: block!important;}
+.layui-show-xs-inline{display: inline!important;}
+.layui-show-xs-inline-block{display: inline-block!important;}
+
 /* 栅格布局 */
 .layui-container{position: relative; margin: 0 auto; padding: 0 15px; box-sizing: border-box;}
 .layui-fluid{position: relative; margin: 0 auto; padding: 0 15px;}
+
 .layui-row:before, .layui-row:after{content: ''; display: block; clear: both;}
 .layui-col-xs1, .layui-col-xs2, .layui-col-xs3, .layui-col-xs4, .layui-col-xs5, .layui-col-xs6, .layui-col-xs7, .layui-col-xs8, .layui-col-xs9, .layui-col-xs10, .layui-col-xs11, .layui-col-xs12
 ,.layui-col-sm1, .layui-col-sm2, .layui-col-sm3, .layui-col-sm4, .layui-col-sm5, .layui-col-sm6, .layui-col-sm7, .layui-col-sm8, .layui-col-sm9, .layui-col-sm10, .layui-col-sm11, .layui-col-sm12
@@ -117,6 +124,11 @@ a cite{font-style: normal; *cursor:pointer;}
 
 /* 小型屏幕（平板） */@media screen and (min-width: 780px) {
   .layui-container{width: 750px;}
+  .layui-hide-sm{display: none!important;}
+  .layui-show-sm-block{display: block!important;}
+  .layui-show-sm-inline{display: inline!important;}
+  .layui-show-sm-inline-block{display: inline-block!important;}
+
   .layui-col-sm1, .layui-col-sm2, .layui-col-sm3, .layui-col-sm4, .layui-col-sm5, .layui-col-sm6, .layui-col-sm7, .layui-col-sm8, .layui-col-sm9, .layui-col-sm10, .layui-col-sm11, .layui-col-sm12{float: left;}
   .layui-col-sm1{width: 8.33333333%;}
   .layui-col-sm2{width: 16.66666667%;}
@@ -146,6 +158,11 @@ a cite{font-style: normal; *cursor:pointer;}
 }
 /* 中型屏幕（桌面） */@media screen and (min-width: 1000px) {
   .layui-container{width: 970px;}
+  .layui-hide-md{display: none!important;}
+  .layui-show-md-block{display: block!important;}
+  .layui-show-md-inline{display: inline!important;}
+  .layui-show-md-inline-block{display: inline-block!important;}
+  
   .layui-col-md1, .layui-col-md2, .layui-col-md3, .layui-col-md4, .layui-col-md5, .layui-col-md6, .layui-col-md7, .layui-col-md8, .layui-col-md9, .layui-col-md10, .layui-col-md11, .layui-col-md12{float: left;}
   .layui-col-md1{width: 8.33333333%;}
   .layui-col-md2{width: 16.66666667%;}
@@ -175,6 +192,11 @@ a cite{font-style: normal; *cursor:pointer;}
 }
 /* 大型屏幕（桌面） */@media screen and (min-width: 1200px) {
   .layui-container{width: 1170px;}
+  .layui-hide-lg{display: none!important;}
+  .layui-show-lg-block{display: block!important;}
+  .layui-show-lg-inline{display: inline!important;}
+  .layui-show-lg-inline-block{display: inline-block!important;}
+  
   .layui-col-lg1, .layui-col-lg2, .layui-col-lg3, .layui-col-lg4, .layui-col-lg5, .layui-col-lg6, .layui-col-lg7, .layui-col-lg8, .layui-col-lg9, .layui-col-lg10, .layui-col-lg11, .layui-col-lg12{float: left;}
   .layui-col-lg1{width: 8.33333333%;}
   .layui-col-lg2{width: 16.66666667%;}
@@ -560,17 +582,16 @@ a cite{font-style: normal; *cursor:pointer;}
 .layui-table-cell{height: 28px; line-height: 28px; padding: 0 15px; position: relative; overflow: hidden; text-overflow: ellipsis;  white-space: nowrap; box-sizing: border-box;}
 .layui-table-cell .layui-form-checkbox{top: -1px;}
 .layui-table-cell .layui-table-link{color: #01AAED;}
+.laytable-cell-space{width: 15px; padding: 0; text-align: center;}
 
 .layui-table-body{position: relative; overflow: auto; margin-right: -1px; margin-bottom: -1px;}
 .layui-table-body .layui-none{line-height: 40px; text-align: center; color: #999;}
 .layui-table-fixed{position: absolute; left: 0; top: 0;}
 .layui-table-fixed .layui-table-body{overflow: hidden;}
-.layui-table-fixed-r{left: auto; right: -1px; box-shadow: -1px 0 8px rgba(0,0,0,.1);}
+.layui-table-fixed-r{left: auto; right: -1px; border-left: 1px solid #e2e2e2; box-shadow: -1px 0 8px rgba(0,0,0,.1);}
-.layui-table-fixed-r th,
-.layui-table-fixed-r td{border-left: 1px solid #e2e2e2!important;}
 .layui-table-fixed-r .layui-table-header{position: relative; overflow: visible;}
 .layui-table-mend{position: absolute; right: -49px; top: 0; height: 100%; width: 50px;}
-.layui-table-tool{position: relative; top: 1px; width: 100%; padding: 7px 10px 0 0; border-width: 0; border-top-width: 1px; height: 41px; font-size: 12px;  white-space: nowrap;}
+.layui-table-tool{position: relative; width: 100%; padding: 7px 10px 0 0; border-width: 0; border-top-width: 1px; height: 41px; margin-bottom: -1px; font-size: 12px;  white-space: nowrap;}
 .layui-table-tool:hover{overflow-x: auto;}
 
 .layui-table-page{height: 26px;}
@@ -594,7 +615,7 @@ a cite{font-style: normal; *cursor:pointer;}
 
 body .layui-table-tips .layui-layer-content{background: none; padding: 0; box-shadow: 0 1px 6px rgba(0,0,0,.1);}
 .layui-table-tips-main{margin: -44px 0 0 -1px; max-height: 150px; padding: 8px 15px; font-size: 14px; overflow-y: scroll; background-color: #fff; color: #333; border: 1px solid #e2e2e2}
-.layui-table-tips-c{position: absolute; right: -3px; top: -12px; width: 18px; height: 18px; padding: 3px; text-align: center; font-weight: 700; border-radius: 100%; font-size: 16px; cursor: pointer; background-color: #666;}
+.layui-table-tips-c{position: absolute; right: -3px; top: -12px; width: 18px; height: 18px; padding: 3px; text-align: center; font-weight: 700; border-radius: 100%; font-size: 14px; cursor: pointer; background-color: #666;}
 .layui-table-tips-c:hover{background-color: #999;}
 
 
@@ -636,24 +657,24 @@ body .layui-table-tips .layui-layer-content{background: none; padding: 0; box-sh
 .layui-nav{position: relative; padding: 0 20px; background-color: #393D49; color: #fff; border-radius: 2px; font-size: 0; box-sizing: border-box;}
 .layui-nav *{font-size: 14px;}
 .layui-nav .layui-nav-item{position: relative; display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; line-height: 60px;}
-.layui-nav .layui-nav-item a{display: block; padding: 0 20px; color: #fff; opacity: 0.8; transition: all .3s; -webkit-transition: all .3s;}
+.layui-nav .layui-nav-item a{display: block; padding: 0 20px; color: #fff; color: rgba(255,255,255,.7); transition: all .3s; -webkit-transition: all .3s;}
 .layui-nav-bar,
 .layui-nav .layui-this:after,
 .layui-nav-tree .layui-nav-itemed:after{position: absolute; left: 0; top: 0; width: 0; height: 5px; background-color: #5FB878; transition: all .2s; -webkit-transition: all .2s;}
 .layui-nav-bar{z-index: 1000;}
 .layui-nav .layui-this a
-,.layui-nav .layui-nav-item a:hover{opacity: 1}
+,.layui-nav .layui-nav-item a:hover{color: #fff;}
 .layui-nav .layui-this:after{content: ''; top: auto; bottom: 0; width: 100%;}
 .layui-nav-img{width: 30px; height: 30px; margin-right: 10px; border-radius: 50%;}
 
 .layui-nav .layui-nav-more{content:''; width: 0; height: 0; border-style: dashed; border-color: transparent; overflow: hidden; cursor: pointer; transition: all .2s; -webkit-transition: all .2s;}
-.layui-nav .layui-nav-more{position: absolute; top: 28px; right: 3px; border-width: 6px; border-top-style: solid; border-top-color: #fff; opacity: 0.8;}
+.layui-nav .layui-nav-more{position: absolute; top: 28px; right: 3px; border-width: 6px; border-top-style: solid; border-top-color: #fff; border-top-color: rgba(255,255,255,.7);}
 .layui-nav .layui-nav-mored,
 .layui-nav-itemed .layui-nav-more{top: 22px; border-style: dashed; border-color: transparent; border-bottom-style: solid; border-bottom-color: #fff;}
 
 .layui-nav-child{display: none; position: absolute; left: 0; top: 65px; min-width: 100%; line-height: 36px; padding: 5px 0;  box-shadow: 0 2px 4px rgba(0,0,0,.12); border: 1px solid #d2d2d2; background-color: #fff; z-index: 100; border-radius: 2px; white-space: nowrap;}
 .layui-nav .layui-nav-child a{color: #333;}
-.layui-nav .layui-nav-child a:hover{background-color: #f2f2f2;}
+.layui-nav .layui-nav-child a:hover{background-color: #f2f2f2; color: #000;}
 .layui-nav-child dd{position: relative;}
 .layui-nav-child dd.layui-this{background-color: #5FB878; color: #fff;}
 .layui-nav .layui-nav-child dd.layui-this a{background-color: #5FB878; color: #fff;}
@@ -677,9 +698,9 @@ body .layui-table-tips .layui-layer-content{background: none; padding: 0; box-sh
 
 .layui-nav-tree .layui-nav-child{position: relative; z-index: 0; top: 0; border: none; box-shadow: none;}
 .layui-nav-tree .layui-nav-child a{height: 40px; line-height: 40px;}
-.layui-nav-tree .layui-nav-child a{color: #fff; opacity: 0.8;}
+.layui-nav-tree .layui-nav-child a{color: #fff; color: rgba(255,255,255,.7);}
 .layui-nav-tree .layui-nav-child a:hover,
-.layui-nav-tree .layui-nav-child{background: none; opacity: 1;}
+.layui-nav-tree .layui-nav-child{background: none; color: #fff;}
 .layui-nav-tree .layui-nav-more{top: 20px; right: 10px;}
 .layui-nav-itemed .layui-nav-more{top: 14px;}
 .layui-nav-itemed .layui-nav-child{display: block; padding: 0; background-color: rgba(0,0,0,.3) !important;} 

src/css/modules/laydate/default/laydate.css

@@ -80,7 +80,7 @@ html #layuicss-laydate{display: none; position: absolute; width: 1989px;}
 .laydate-time-list p{position: relative; top: -4px; line-height: 29px;}
 .laydate-time-list ol{height: 181px; overflow: hidden;}
 .laydate-time-list>li:hover ol{overflow-y: auto;}
-.laydate-time-list ol li{padding-left: 33px; line-height: 30px; text-align: left; cursor: pointer;}
+.laydate-time-list ol li{width: 130%; padding-left: 33px; line-height: 30px; text-align: left; cursor: pointer;}
 
 /* 提示 */
 .layui-laydate-hint{position: absolute; top: 115px; left: 50%; width: 250px; margin-left: -125px; line-height: 20px; padding: 15px; text-align: center; font-size: 12px; color: #FF5722;}

src/lay/modules/laydate.js

@@ -1,6 +1,6 @@
 /**
  
- @Name : layDate 5.0.1 日期时间控件
+ @Name : layDate 5.0.2 日期时间控件
  @Author: 贤心
  @Site：http://www.layui.com/laydate/
  @License：MIT
@@ -55,7 +55,7 @@
   }
 
   ,laydate = {
-    v: '5.0.1'
+    v: '5.0.2'
     ,config: {} //全局配置项
     ,index: (window.laydate && window.laydate.v) ? 100000 : 0
     ,path: ready.getPath
@@ -875,6 +875,12 @@
       value = value.replace(/\s+/g, ' ').replace(/^\s|\s$/g, '');
     }
     
+    //如果点击了开始，单未选择结束就关闭，则重新选择开始
+    if(that.startState && !that.endState){
+      delete that.startState;
+      that.endState = true;
+    };
+
     if(typeof value === 'string' && value){
       if(that.EXP_IF.test(value)){ //校验日期格式
         if(options.range){
@@ -894,7 +900,7 @@
         ) + '<br>已为你重置');
         error = true;
       }
-    } else if(typeof value === 'object'){
+    } else if(value && value.constructor === Date){ //如果值为日期对象时
       options.dateTime = that.systemDate(value);
     } else {
       options.dateTime = that.systemDate();
@@ -1587,7 +1593,9 @@
       ,confirm: function(){
         if(options.range){
           if(!that.endDate) return that.hint('请先选择日期范围');
-          if(lay(btn).hasClass(DISABLED)) return;
+          if(lay(btn).hasClass(DISABLED)) return that.hint(
+            options.type === 'time' ? TIPS_OUT.replace(/日期/g, '时间') : TIPS_OUT
+          );
         } else {
           if(lay(btn).hasClass(DISABLED)) return that.hint('不在有效日期或时间范围内');
         }
@@ -1763,8 +1771,8 @@
       that.remove();
     }).on('keydown', function(e){
       if(e.keyCode === 13){
-        e.preventDefault();
         if(lay('#'+ that.elemID)[0] && that.elemID === Class.thisElem){
+          e.preventDefault();
           lay(that.footer).find(ELEM_CONFIRM)[0].click();
         }
       }

src/lay/modules/layedit.js

@@ -387,7 +387,7 @@ layui.define(['layer', 'form'], function(exports){
         var that = this;
         layui.use('upload', function(upload){
           var uploadImage = set.uploadImage || {};
-          toolActive.haveUpload || upload.render({
+          upload.render({
             url: uploadImage.url
             ,method: uploadImage.type
             ,elem: $(that).find('input')[0]
@@ -403,7 +403,6 @@ layui.define(['layer', 'form'], function(exports){
               }
             }
           });
-          toolActive.haveUpload = true;
         });
       }
       //插入代码

src/lay/modules/table.js

@@ -76,6 +76,8 @@ layui.define(['laytpl', 'laypage', 'layer', 'form'], function(exports){
           }()
           ,'{{# if(item2.checkbox){ }}'
             ,'<th data-field="{{ item2.field||i2 }}" data-type="checkbox" unresize="true"><div class="layui-table-cell laytable-cell-checkbox"><input type="checkbox" name="layTableCheckbox" lay-skin="primary" lay-filter="layTableAllChoose" {{# if(item2[d.data.checkName]){ }}checked{{# }; }}></div></th>'
+          ,'{{# } else if(item2.space){ }}'
+            ,'<th data-field="{{ item2.field||i2 }}" unresize="true"><div class="layui-table-cell laytable-cell-space"></div></th>'
           ,'{{# } else { }}'
             ,'<th data-field="{{ item2.field||i2 }}" {{#if(item2.colspan){}} colspan="{{item2.colspan}}"{{#} if(item2.rowspan){}} rowspan="{{item2.rowspan}}"{{#}}} {{# if(item2.unresize){ }}unresize="true"{{# } }}>'
               ,'{{# if(item2.colspan > 1){ }}'
@@ -205,6 +207,15 @@ layui.define(['laytpl', 'laypage', 'layer', 'form'], function(exports){
     that.layFixRight = reElem.find(ELEM_FIXR);
     that.layTool = reElem.find(ELEM_TOOL);
     
+    //设置body区域高度
+    if(options.height){
+      var bodyHeight = parseFloat(options.height) - parseFloat(that.layHeader.height()) - 1;
+      if(options.page){
+        bodyHeight = bodyHeight - parseFloat(that.layTool.outerHeight() + 1);
+      }
+      that.layBody.css('height', bodyHeight);
+    }
+    
     that.pullData(1);
     that.events();
   };
@@ -285,25 +296,23 @@ layui.define(['laytpl', 'laypage', 'layer', 'form'], function(exports){
         var tds = [], tds_fixed = [], tds_fixed_r = [];
         that.eachCols(function(i3, item3){
           var content = item1[item3.field||i3];
-          if(content === undefined || content === null){
+          if(content === undefined || content === null) content = '';
-            content = (i3 === 0 ? i1+1 : '');
-          }
           
           if(item3.colspan > 1) return;
           
           var td = ['<td data-field="'+ (item3.field||i3) +'"'+ function(){
             var attr = [];
             if(item3.edit) attr.push(' data-edit="true"'); //是否允许单元格编辑
-            if(item3.align) attr.push(' data-off="click" align="'+ item3.align +'"'); //对齐方式
+            if(item3.align) attr.push(' align="'+ item3.align +'"'); //对齐方式
             if(item3.templet) attr.push(' data-content="'+ content +'"'); //自定义模板
+            if(item3.toolbar) attr.push(' data-off="true"'); //自定义模板
             if(item3.event) attr.push(' lay-event="'+ item3.event +'"'); //自定义事件
             if(item3.style) attr.push(' style="'+ item3.style +'"'); //自定义样式
             return attr.join('');
           }() +'>'
             ,'<div class="layui-table-cell laytable-cell-'+ function(){
-              if(item3.checkbox){
+              if(item3.checkbox) return 'checkbox';
-                return 'checkbox';
+              if(item3.space) return 'space'; //间距
-              }
               return options.index + '-' + (item3.field||i3);
             }() +'">' + function(){
               if(item3.checkbox){
@@ -316,8 +325,8 @@ layui.define(['laytpl', 'laypage', 'layer', 'form'], function(exports){
                   return item1[checkName] ? 'checked' : '';                   
                 }() +'>';
               }
-              if(item3.fixed === 'right' && item3.toolbar){
+              if(item3.toolbar){
-                return $(item3.toolbar).html();
+                return laytpl($(item3.toolbar).html()).render(item1);
               }
               return item3.templet ? laytpl($(item3.templet).html() || String(content)).render(item1) : content;
             }()
@@ -355,15 +364,6 @@ layui.define(['laytpl', 'laypage', 'layer', 'form'], function(exports){
       that.cacheData = data;
     }
     
-    //设置body区域高度
-    if(options.height){
-      var bodyHeight = parseFloat(options.height) - parseFloat(that.layHeader.height()) - 1;
-      if(options.page){
-        bodyHeight = bodyHeight - parseFloat(that.layTool.outerHeight() + 2);
-      }
-      that.layBody.css('height', bodyHeight);
-    }
-    
     if(data.length === 0){
       return that.layMain.html('<div class="layui-none">无数据</div>');
     }
@@ -555,7 +555,7 @@ layui.define(['laytpl', 'laypage', 'layer', 'form'], function(exports){
     ,th = that.layHeader.find('th')
     ,resizing
     ,ELEM_CELL = '.layui-table-cell'
-    ,filter = config.id || config.elem.attr('lay-filter');
+    ,filter = config.elem.attr('lay-filter');
 
     //拖拽调整宽度    
     th.on('mousemove', function(e){

src/lay/modules/upload.js

@@ -417,7 +417,7 @@ layui.define('layer' , function(exports){
     }
     
     //文件选择
-    that.elemFile.on('change', function(){
+    that.elemFile.off('upload.change').on('upload.change', function(){
       var files = this.files || [];
       setChooseFile(files);
       options.auto ? that.upload() : setChooseText(files); //是否自动触发上传
@@ -431,6 +431,10 @@ layui.define('layer' , function(exports){
     //防止事件重复绑定
     if(options.elem.data('haveEvents')) return;
     
+    that.elemFile.on('change', function(){
+      $(this).trigger('upload.change');
+    });
+    
     options.elem.on('click', function(){
       if(that.isFile()) return;
       $(this).trigger('upload.start');

src/layui.js

@@ -19,7 +19,7 @@
   }
 
   ,Layui = function(){
-    this.v = '2.0.1'; //版本号
+    this.v = '2.0.2'; //版本号
   }
 
   //获取layui所在目录

test/json/upload/demoLayEdit.json

@@ -0,0 +1,8 @@
+{
+  "code": 0
+  ,"msg": ""
+  ,"data": {
+    "src": "http://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg"
+    ,"title": "图片名称"
+  }
+}

test/laydate.html

@@ -23,7 +23,6 @@ body{padding: 50px 100px;}
   <input type="text" class="layui-input" id="test1">
 </div>
 
-
 <br><br><hr><br>
 
 日期选择器：
@@ -62,6 +61,21 @@ body{padding: 50px 100px;}
 
 <br><br><hr><br>
 
+
+同时绑定多个：
+<div class="layui-inline">
+  <input type="text" class="layui-input test-item">
+</div>
+<div class="layui-inline">
+  <input type="text" class="layui-input test-item">
+</div>
+<div class="layui-inline">
+  <input type="text" class="layui-input test-item">
+</div>
+
+<br><br><hr><br>
+
+
 墨绿主题：
 <div class="layui-inline">
   <input type="text" class="layui-input" id="test6-1">
@@ -185,6 +199,14 @@ layui.use('laydate', function(){
     }
   });
   
+  //同时绑定多个
+  lay('.test-item').each(function(){
+    laydate.render({
+      elem: this
+      ,trigger: 'click'
+    });
+  });
+  
   //自定义重要日
   var ins555 = laydate.render({
     elem: '#test555'

test/layedit.html

@@ -34,8 +34,8 @@ layui.use('layedit', function(){
   var index = layedit.build('demo', {
     //hideTool: ['image']
     uploadImage: {
-      url: '/upload/test/'
+      url: 'json/upload/demoLayEdit.json'
-      ,type: 'post'
+      ,type: 'get'
     }
     //,tool: []
     //,height: 100

test/responsive.html

@@ -0,0 +1,29 @@
+ 
+ 
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<title>响应式测试 - Layui</title>
+<link rel="stylesheet" href="../src/css/layui.css">
+<style>
+body{padding: 20px;}
+</style>
+</head>
+<body>
+
+<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
+<!--[if lt IE 9]>
+  <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
+  <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
+<![endif]-->
+
+<div class="layui-hide-xs layui-show-sm-inline layui-show-md-block">
+ 移动：隐藏
+ <br>平板：inline
+ <br>PC：block
+</div>
+
+</body>
+</html>

test/table.html

@@ -245,7 +245,8 @@ layui.use('table', function(){
     ,width: 900
     //,height: 274
     ,cols: [[ //标题栏
-      {checkbox: true, LAY_CHECKED: true}
+      {space: true, fixed: true}
+      ,{checkbox: true, LAY_CHECKED: true}
       ,{field: 'id', title: 'ID', width: 80, sort: true}
       ,{field: 'username', title: '用户名', width: 120}
       ,{field: 'email', title: '邮箱', width: 150}