【laydate】layUI-laydate日期控件三组联动

最新推荐文章于 2025-09-24 11:35:07 发布

原创

最新推荐文章于 2025-09-24 11:35:07 发布 · 663 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#layui #javascript #前端

本文介绍如何利用LayUI框架中的laydate组件来实现三个不同用途的日期选择器，包括编制日期、校对日期及审核日期的选择功能，并通过JavaScript进行联动设置，确保各个日期之间的逻辑正确性。

日期控件三组联动

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" type="text/css" href="layui/css/layui.css" />

</head>

<body>
    <div style="width: 660px;margin: 60px auto 0">
        <!-- 复制开始部分 -->
        <div class="" style="width: 45%;margin-bottom:20px">
            <label class="layui-form-label qbdms-label" title="编制日期">日期一</label>
            <div class="layui-input-block qbdms-input">
                <input type="text" placeholder="请输入" id="startTime" autocomplete="off"
                    class="layui-input dateTimeFiled input-right time-init" name="bzrq" maxlength="25">
            </div>
        </div>
        <div class="" style="width: 45%;margin-bottom:20px">
            <label class="layui-fo