layui中timeline的使用方法-创新互联
使用layui timeline过程记录:
环江ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景,ssl证书未来市场广阔!成为创新互联建站的ssl证书销售渠道,可以享受市场价格4-6折优惠!如果有意向欢迎电话联系或者加微信:028-86922220(备注:SSL证书合作)期待与您的合作!layui官网时间线介绍比较少,可能是太简单了,这里把时间线通过请求后台数据。再自动填写到对应区块,进行了封装;
代码如下:
function timelineshow(url,json,div){ $.ajax({ url: url, type: "post", data: json, dataType: "json", success: function (res) { console.log(res); if(res.SUCCESS===true){ var list = res.data; var uls = "
- ";
var uls1 = "
- "; var lis1 = "
- "; var lis2 = " "; var is = ""; var divs = "
- ";
var uls2 = "
";
var divs2 = "
";
var h4s = ""; var h4s2 = "
"; var ps = ""; var ps2 = "
"; var br = ""; if(list.length>0){ var content1 = ""; content1 = content1+uls; for(var i=0; i调用如下:
var url = "./json/timeline/dome1.js";
var json = {};
timelineshow(url,json,"div1");//url为请求数据地址;json为参数json字符串;打三个参数为时间线显示位置标签id
参数说明:
url:实际后台请求地址;
json:请求参数;
第三个参数:时间线绘制点
数据响应形式:
{ "SUCCESS": true, "data": [{ "time": "2019-01-04 11:00:42", "content":"这是一条测试内容", "ul":[{ "content":"子内容1" }, { "content":"子内容1" }] }, { "time": 1546571007000, "content":"这是一条测试内容", "ul":[{ "content":"子内容1" }, { "content":"子内容1" }] }, { "time": 1546571096000, "content":"这是一条测试内容" }, { "time": 1546571118000, "content":"这是一条测试内容" }, { "time": 1546571159000, "content":"这是一条测试内容" }, { "time": 1546571372000, "content":"这是一条测试内容" }, { "time": 1546571458000, "content":"这是一条测试内容" }, { "time": 1546571721000, "content":"这是一条测试内容" }, { "time": 1546572137000, "content":"这是一条测试内容" }], "msg": "查询成功!" }
参数说明:
“SUCCESS”:调用接口状态反馈;
“data”:时间线内容
“time”:时间线时间;这里可以传入时间戳形式;也可以传入定义好的时间格式;如:"2019-01-04 11:00:42"
“content”:内容
“url”:子内容
“content”:内容部分
“msg”:调用接口反馈信息;当“SUCCESS”为false时,会根据此字段进行提示信息
效果展示:
以上就是layui timeline使用示例的详细内容,更多请关注创新互联网站制作公司其它相关文章!
分享题目:layui中timeline的使用方法-创新互联
网页地址:http://azwzsj.com/article/dopdgc.html