一个页面多个地方使用日期组件 - layui.laydate时，多次渲染闪退问题

最新推荐文章于 2023-07-04 16:23:09 发布

g229191727

最新推荐文章于 2023-07-04 16:23:09 发布

阅读量3k

点赞数 5

分类专栏：总结文章标签： laydate 闪退多

本文链接：https://blog.csdn.net/g229191727/article/details/88799900

版权

总结专栏收录该内容

20 篇文章 0 订阅

订阅专栏

需求：页面中有多个地方需要设置日期，所以选择了layui的 laydate控件。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="../jquery/v3.2.1/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="../laydate/v5.0.9/laydate/laydate.js"></script>
</head>
<body>
<div class="">
    日期1：
    <input type="text" class="J-startTime" value="" placeholder="请选择开始日期" readonly="readonly">
    <span class="from-to">&nbsp-&nbsp</span>
    <input type="text" class="J-endTime" value="" placeholder="请选择结束日期" readonly="readonly">
</div>
<div class="">
    日期2：
    <input type="text" class="J-startTime" value="" placeholder="请选择开始日期" readonly="readonly">
    <span class="from-to">&nbsp-&nbsp</span>
    <input type="text" class="J-endTime" value="" placeholder="请选择结束日期" readonly="readonly">
</div>
</body>
</html>

问题：但是在点击第二个“日期选择框”时，生成的选择框只是显示一下就消失了，参考网上的资料，是由于我们点击了“日期选择框”后，laydate会给input框增加一个 lay-key=”1”。

解决方法：通过类选择“日期选择框”，遍历循环创建实例。

$(function () {
    //遍历循环创建实例
    $('.J-startTime').each(function(index){
        var _this=this;
        laydate.render({
            elem: _this,
            done: function(value, date){

            }
        });
    });
    $('.J-endTime').each(function (index) {
        var _this=this;
        endDate[index]=laydate.render({
            elem:_this,
        });
    });
});

g229191727

关注

5
点赞
踩
5

收藏

觉得还不错? 一键收藏
9
评论
一个页面多个地方使用日期组件 - layui.laydate时，多次渲染闪退问题

需求：页面中有多个地方需要设置日期，所以选择了layui的 laydate控件。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script type="text/jav...
复制链接

扫一扫

专栏目录