使用layui timeline過程記錄：

網(wǎng)站設計制作過程拒絕使用模板建站；使用PHP+MYSQL原生開發(fā)可交付網(wǎng)站源代碼;符合網(wǎng)站優(yōu)化排名的后臺管理系統(tǒng)；成都網(wǎng)站設計、網(wǎng)站建設收費合理；免費進行網(wǎng)站備案等企業(yè)網(wǎng)站建設一條龍服務.我們是一家持續(xù)穩(wěn)定運營了10年的創(chuàng)新互聯(lián)網(wǎng)站建設公司。

layui官網(wǎng)時間線介紹比較少，可能是太簡單了，這里把時間線通過請求后臺數(shù)據(jù)。再自動填寫到對應區(qū)塊，進行了封裝；

代碼如下：

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 uls2 = "
";
                       var lis = "
";
                       var lis1 = "
";
                       var lis2 = "
";
                       var is = "";
                       var divs = "
";
                       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; i0){
                                   var list2 = list[i].ul;
                                   content2 = content2+uls1;
                                   for(var j=0; j
調(diào)用如下：
var url = "./json/timeline/dome1.js";
var json = {}; 
timelineshow(url,json,"div1");//url為請求數(shù)據(jù)地址；json為參數(shù)json字符串；打三個參數(shù)為時間線顯示位置標簽id
參數(shù)說明：
url:實際后臺請求地址；
json:請求參數(shù)；
第三個參數(shù):時間線繪制點
數(shù)據(jù)響應形式：
{
    "SUCCESS": true,
    "data": [{
        "time": "2019-01-04 11:00:42",
        "content":"這是一條測試內(nèi)容",
        "ul":[{
            "content":"子內(nèi)容1"
        },
        {
            "content":"子內(nèi)容1"
        }]
    }, {
        "time": 1546571007000,
        "content":"這是一條測試內(nèi)容",
        "ul":[{
            "content":"子內(nèi)容1"
        },
        {
            "content":"子內(nèi)容1"
        }]
    }, {
        "time": 1546571096000,
        "content":"這是一條測試內(nèi)容"
    }, {
        "time": 1546571118000,
        "content":"這是一條測試內(nèi)容"
    }, {
        "time": 1546571159000,
        "content":"這是一條測試內(nèi)容"
    }, {
        "time": 1546571372000,
        "content":"這是一條測試內(nèi)容"
    }, {
        "time": 1546571458000,
        "content":"這是一條測試內(nèi)容"
    }, {
        "time": 1546571721000,
        "content":"這是一條測試內(nèi)容"
    }, {
        "time": 1546572137000,
        "content":"這是一條測試內(nèi)容"
    }],
    "msg": "查詢成功！"
}
參數(shù)說明：
“SUCCESS”：調(diào)用接口狀態(tài)反饋；
“data”:時間線內(nèi)容
“time”:時間線時間;這里可以傳入時間戳形式；也可以傳入定義好的時間格式;如："2019-01-04 11:00:42"
“content”:內(nèi)容
“url”:子內(nèi)容
“content”:內(nèi)容部分
“msg”:調(diào)用接口反饋信息；當“SUCCESS”為false時，會根據(jù)此字段進行提示信息
效果展示：
以上就是layui timeline使用示例的詳細內(nèi)容，更多請關注創(chuàng)新互聯(lián)其它相關文章！
            
            
                        

            分享名稱：layui中timeline的使用方法            

            當前URL：http://weahome.cn/article/jsjdhs.html