jquery日历插件

这是在14年工做的时候写的一个日历插件,当时实际上是想去网上找一个界面好看,并且有方便改代码的插件,那时候比较笨,没有找到想要的,后来就本身写了一个,但我不擅长于写样式,写完后后发现仍是很差看,用了一段时间后发现laydate,如今项目里基本都使用laydate日历插件了。我写的这个是有不少功能不完善的。在这里主要是分享出来给初学jquery的同窗参考下。效果图javascript

这个界面有的人会以为似曾相识,其实css是参考的,具体出自哪里就不记得了,css

js源代码:http://git.oschina.net/sunyurepository/javascripthtml

用例:java

<!DOCTYPE html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
   <link rel="stylesheet" href="meCalendar.css">
    <script src="../jquery-1.11.1.min.js" type="text/javascript"></script>  
   <script src="jquery-calendar-v3.js" type="text/javascript"></script>
   <script type="text/javascript">
      $(function(){
         $("#mydate").calendar({
            format:'yyyy-MM-dd',//默认格式yyyy-MM-dd
            beginYear:2014,
            endYear:2030,
            max:new Date(),//最大时间设置只能为Date,默认不设置
            istoday:true  //设置初始时间为今天
            //callBack:back1 //回调
         });
         $("#mydate1").calendar({
            format:'yyyy年MM月dd',
            beginYear:2000,
            endYear:2020,
            min:new Date(),
            //callBack:back2
         
         });
         $("#mydate2").calendar({
            format:'yyyy年MM月dd',
            beginYear:2015,
            endYear:2020,
            min:new Date(),
            //callBack:back2
         });
      });
      function back1(time){
         //console.log("first invoded:"+time);
      }
      function back2(time){
         //console.log("second invoded:"+time);
      }
   </script>
</head>
<body>
   <input type="text" id="mydate" placeholder="日期"/>
   <input type="text" id="mydate1" placeholder="日期"/>
   <input type="text" id="mydate2" placeholder="日期"/>
   
</body>
</html>
相关文章
相关标签/搜索