工具模块
util是由工具类方法和小组件组成的集合。
| API | 描述 |
|---|---|
| var util = layui.util | 获得 util 模块。 |
| util.fixbar(options) | fixbar 固定条组件,用法:#详见 |
| util.countdown(endTime, serverTime, callback) | 倒计时 |
| util.timeAgo(time, onlyDate) | 某个时间在多久前 |
| util.toDateString(time, format) | 将毫秒数或日期对象转换成日期格式字符 |
| util.digit(num, length) | 数字前置补零 |
| util.escape(str) | 转义 HTML 字符 |
| util.unescape(str) | 还原 HTML 字符 |
| util.openWin(options) 2.8+ | 打开浏览器新标签页 |
| util.on(attr, obj, eventType) | 批量事件处理 |
util.countdown(endTime, serverTime, callback);
endTime : 结束时间毫秒数或 Date 对象serverTime : 服务器当前时间毫秒数 或 Date 对象callback : 倒计时回调函数。若倒计时正在运行,则每一秒都会执行一次。并且返回以下三个参数。
date 包含天/时/分/秒的对象serverTime 当前服务器时间毫秒数或 Date 对象timer 计时器返回的索引,用于 clearTimeout该方法并不负责视图的呈现,而仅返回倒计时数值。 相关用法见:#示例
layui.use('util', function(){
var util = layui.util;
// 示例
var endTime = new Date(2099,1,1).getTime() // 假设为结束日期
var serverTime = new Date().getTime(); // 这里采用的是本地时间,实际使用一般是取服务端时间
util.countdown(endTime, serverTime, function(date, serverTime, timer){
console.log(date, serverTime, timer)
});
});
var result = util.timeAgo(time, onlyDate);
time : 某个时间的毫秒数或日期对象onlyDate : 是否在超过 30 天后,只返回日期字符,而不返回时分秒返回结果
time 在 3 分钟以内,返回: 刚刚time 在 30 天以内,返回: 若干分钟前、若干小时前、若干天前,如:5 分钟前time 在 30 天以上,返回: 日期字符,如: 2023-01-01var result = util.timeAgo(1672531200000); // 2023-01-01 00:00:00
相关效果见:#示例
var result = util.toDateString(time, format);
time : 毫秒数或日期对象format : 日期字符格式。默认格式:yyyy-MM-dd HH:mm:ss 。可自定义,如: yyyy年MM月dd日var result = util.toDateString(1672531200000, 'yyyy-MM-dd'); // 2023-01-01
util.digit(num, length);
num : 原始数字length : 数字长度,如果原始数字长度小于 length,则前面补零该方法返回一个 string 类型的结果,如:
var rs1 = util.digit(6, 2); // "06"
var rs2 = util.digit(7, 3); // "007"
util.escape(str); 转义 HTMLutil.unescape(str); 还原被转义的 HTML参数 str : 任意 HTML 字符
var str1 = util.escape('<div>123</div>'); // 返回: <div>123</div>
var str2 = util.unescape('<div>123</div>'); // 返回: <div>123</div>
util.openWin(options);
options : 属性配置项。可选项详见下表| 属性 | 描述 |
|---|---|
| url | 要打开页面 URL |
| target | 打开页面的方式或窗口 name |
| content | 打开的页面内容。若设置了 url 属性,则该属性无效 |
| specs | 窗口的相关配置,同 window.open() 的 specs |
| window | 当前所在的窗口对象,默认 self |
该方法基于原生 window.open() 的二次封装,以提升打开浏览器窗口的灵活性。
// 打开一个 url
util.openWin({
url: 'https://cn.bing.com'
});
// 打开一个自定义内容窗口
util.openWin({
content: 'Hello World.'
});
util.on(attr, obj, eventType);
attr : 触发事件的元素属性名obj : 事件回调函数集合eventType : 事件类型。默认 click