1. 首先上代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>cron表达式生成</title>
<meta name="renderer" content="webkit" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<link href="layui/css/layui.css" rel="stylesheet">
</head>
<body>
<div class="layui-fluid">
<div class="layui-row layui-col-space15">
<div class="layui-col-md8">
<div class="layui-row layui-col-space15">
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">cron表达式</div>
<div class="layui-card-body">
<input type="text" class="layui-input" id="cron" value="0/20 * * * * ?" />
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="layui/layui.js"></script>
<script>
// base中设定的是存放拓展模块的根目录,将 `cron` 文件夹复制到此根目录
layui.config({ base: './' }).extend({cron: 'cron/cron'}); //设定模块别名
// 然后我们就可以像使用内置模块一样使用扩展模块
layui.use(['cron'], function(){
var $ = layui.$;
var cron = layui.cron;
cron.render({
elem: "#cron", // 绑定元素
url: "https://www.fastmock.site/mock/58329c0ee61b03d6ce3ba0c1e2f13691/world/cron", // 获取最近运行时间的接口
value: $("#cron").val(), // 默认值
done: function (cronStr) {
console.log("生成表达式:" + cronStr);
$("#cron").val(cronStr);
},
});
});
</script>
</body>
</html>
下载资源:
1. cron生成组件(开源)文章来源:https://www.toymoban.com/news/detail-660106.html
正常来说你只要下载 开源的cron组件,再下载layui,把我上面的html保存到layui文件夹同级目录,浏览器打开这个html,点击输入框的位置就可以正常使用,为避免无法使用,本文章也有嵌入资源可直接下载文章来源地址https://www.toymoban.com/news/detail-660106.html
到了这里,关于layui第三方组件cron的使用的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!