Layer弹窗显示动态时间

突然有了一个显示倒计时的需求,本来想着小问题,找段js插进去就好了。

<span id="span_dt_dt"></span>
    <script>
        function show_time(){
            window.setTimeout("show_time()", 1000);
            BirthDay=new Date('2020 14:12:45');//改成你的计时日期
            console.log(BirthDay)
            today=new Date();
            timeold=(BirthDay.getTime()-today.getTime());
            sectimeold=timeold/1000
            secondsold=Math.floor(sectimeold);
            msPerDay=24*60*60*1000
            e_daysold=timeold/msPerDay
            daysold=Math.floor(e_daysold);
            e_hrsold=(e_daysold-daysold)*24;
            hrsold=Math.floor(e_hrsold);
            e_minsold=(e_hrsold-hrsold)*60;
            minsold=Math.floor((e_hrsold-hrsold)*60);
            seconds=Math.floor((e_minsold-minsold)*60);
            span_dt_dt.innerHTML=daysold+"天"+hrsold+"小时"+minsold+"分"+seconds+"秒" ;
        }
    show_time();
    </script>

这个是我从其他大佬哪里拿的,一开始没跑起来,后来检查了一下是new Date的时间格式不对,大概是这个样子,自己再改下

为什么选这个呢,是因为这个带时分秒

这个在平面页面上显示倒ok,当我把时间dom移动到layer.open中,好家伙,问题来了。

layer只读取第一次在页面抓取的内容,一开始没有用html类型的弹出模式。

然我我想着通过layer内置方法或者回调来解决实时刷新的问题

然后拿layer中success的回调打算做点手脚,

在改造过程中,还知道了layero这个东西,其实这个就是弹出层的DOM,

通过

$(layero).find("#span_dt_dt").text($txt) 
这个来赋值,好家伙,虽然跑通了但还是不行,依然改变不了静态的本质。
success: function(layero, index){
        //             // var form = $(layero).find("#span_dt_dt").text(1232);//获取子页面元素

                    
        //             window.setTimeout("show_time()", 1000);
        //             BirthDay=new Date('2020 14:12:45');//改成你的计时日期
        //             console.log(BirthDay)
        //             today=new Date();
        //             timeold=(BirthDay.getTime()-today.getTime());
        //             sectimeold=timeold/1000
        //             secondsold=Math.floor(sectimeold);
        //             msPerDay=24*60*60*1000
        //             e_daysold=timeold/msPerDay
        //             daysold=Math.floor(e_daysold);
        //             e_hrsold=(e_daysold-daysold)*24;
        //             hrsold=Math.floor(e_hrsold);
        //             e_minsold=(e_hrsold-hrsold)*60;
        //             minsold=Math.floor((e_hrsold-hrsold)*60);
        //             seconds=Math.floor((e_minsold-minsold)*60);
        //             // $(layero).find("#span_dt_dt").innerHTML=daysold+"天"+hrsold+"小时"+minsold+"分"+seconds+"秒" ;
        //             $txt=daysold+"天"+hrsold+"小时"+minsold+"分"+seconds+"秒" ;
        //             $(layero).find("#span_dt_dt").text($txt) ;
                    
        //       }

然后就采用了一开始的保底的办法,就是用layer的ifame这个,就是跳转到新页面。然后成功。。。。

原文地址:https://www.cnblogs.com/chenliuxiao/p/12487048.html