zoukankan      html  css  js  c++  java
  • 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这个,就是跳转到新页面。然后成功。。。。

  • 相关阅读:
    msvc交叉编译:使用vcvarsall.bat设置命令行编译环境
    DDOS到底是什么,怎么预防,看看就明白了
    服务器安全检测和防御技术
    YApi导入swagger生成的接口
    Springboot swagger2 导出api文档
    使用Swagger2Markup归档swagger生成的API文档
    springboot + swagger2 生成api文档
    swagger2 导出离线Word/PDF/HTML文档
    Swagger使用总结
    springboot配置swagger-rest文档
  • 原文地址:https://www.cnblogs.com/chenliuxiao/p/12487048.html
Copyright © 2011-2022 走看看