master

分支 (1)

管理

管理

master

layui_step_bar_steps
/
index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Layui 步骤条steps</title>
    <link rel="stylesheet" href="./layui/css/layui.css">
</head>
<body>
<div id="steps"></div><br>
<button class="layui-btn layui-btn-normal" onclick="nextStep()">下一步</button>
<script src="./layui/layui.js"></script>
<script>
    layui.extend({
        steps: './layui/extends/steps/steps'
    });
    layui.use('steps', function () {
        var steps = layui.steps;
        steps.render({
            ele: '#steps',
            data: [
                {'title': "第一步", "desc": "我是详情"},
                {'title': "第二步", "desc": "我是详情"},
                {'title': "第三步", "desc": "我是详情"},
                {'title': "第四步", "desc": "我是详情"}
            ], //desc 不是必须
            //current: 2 //默认为第几步
        });
    });
    function nextStep() {
        layui.steps.next();
    }
</script>

</body>
</html>