工具模块
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