jquery easyUI组件easyui-datebox限制时间范围

最新推荐文章于 2021-01-20 15:22:46 发布

Qingzhaoi

最新推荐文章于 2021-01-20 15:22:46 发布

阅读量248

点赞数

本文链接：https://blog.csdn.net/Qingzhaoi/article/details/77001873

版权

web页面偶尔会有这个需求，暂时记录一下

源代码如下：

[html]view plaincopy 
   
 <!DOCTYPE html>  
 <html>  
 <head>  
     <meta charset="UTF-8">  
     <title>Restrict Date Range in DateBox - jQuery EasyUI Demo</title>  
     <link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">  
     <link rel="stylesheet" type="text/css" href="../../themes/icon.css">  
     <link rel="stylesheet" type="text/css" href="../demo.css">  
     <script type="text/javascript" src="../../jquery.min.js"></script>  
     <script type="text/javascript" src="../../jquery.easyui.min.js"></script>  
 </head>  
 <body>  
     <h2>Restrict Date Range in DateBox</h2>  
     <p>案例是严格规定了日期范围：从当前时间开始的前后10天内.</p>  
     <div style="margin:20px 0;"></div>  
     <input id="dd"></input>  
     <script>  
         $(function(){  
             $('#dd').datebox().datebox('calendar').calendar({  
                 validator: function(date){  
                     var now = new Date(); //获取当前时间  
                     var d1 = new Date(now.getFullYear(), now.getMonth(), now.getDate()-10); //确定最早时间  
                     var d2 = new Date(now.getFullYear(), now.getMonth(), now.getDate()+10); //确定最晚时间  
                     return d1<=date && date<=d2;   //返回限定的时间范围  
                 }  
             });  
         });  
     </script>  
 </body>  
 </html>  
 北京整形医院：http://www.shkqmrw.com

Qingzhaoi

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
jquery easyUI组件easyui-datebox限制时间范围

web页面偶尔会有这个需求，暂时记录一下源代码如下：[html] view plain copy> html> head> meta charset="UTF-8"> title>Restrict Date Range in DateBox - jQuery EasyUI Demotitle>
复制链接

扫一扫