开源一款简单清爽的日历组件,JavaScript版的

时间:2022-10-12 13:29:32

开源一款简单清爽的日历组件,JavaScript版的

源码会在最后给出地址,需要的朋友自己去下载。最近项目需要做一个日程安排的功能,就是点击日历的某一天弹出一个录入页面,填完信息后保存当天的日程安排。有日程的日期会有不同的标记(比如加一个背景色啥的)。网上找了很久,都不尽如人意,于是我只好自己找点资料弄了一个。具体的页面就不给出了,关于这个日历,现在是一个单独的js组件,分享出来。

调用方法:首先你的页面需要有一个div,id自己定义。

比如:

<div id="wannianli"></div>

js代码:

var calender = new Calender(opts);

calender.init();

属性

开源一款简单清爽的日历组件,JavaScript版的

方法

开源一款简单清爽的日历组件,JavaScript版的

范例:

var calender = new Calender(

{

id:"wannianli",

width:660,

height:500,

background:"#fff",

color:'#222',

monthTag:["1 月","2 月","3 月","4 月","5 月","6 月","7 月","8 月","9 月","10 月","11 月","12 月"],

weekTag:["周日","周一", "周二", "周三", "周四", "周五", "周六"],

format:"yyyy-MM-dd",

dbclick : function(formatStr){

alert(formatStr);

},

/click : function(formatStr){

alert(formatStr);

},
/

}

);

calender.init(2015,1);

依赖文件:jQuery.js、wannianli.css

源码下载地址:http://pan.baidu.com/s/1skFrxiH

个人博客:www.xiaotublog.com

开源一款简单清爽的日历组件,JavaScript版的的更多相关文章

  1. 开源一款强大的文件服务组件(QJ&lowbar;FileCenter)(系列一)

    系列文章 1. 开源一款强大的文件服务组件(QJ_FileCenter)(系列一) 2. 开源一款强大的文件服务组件(QJ_FileCenter)(系列二 安装说明) 3. 开源一款强大的文件服务组件 ...

  2. 开源一款强大的文件服务组件(QJ&lowbar;FileCenter)(系列二 安装说明)

    系列文章 1. 开源一款强大的文件服务组件(QJ_FileCenter)(系列一) 2. 开源一款强大的文件服务组件(QJ_FileCenter)(系列二 安装说明) 3. 开源一款强大的文件服务组件 ...

  3. 开源一款强大的文件服务组件(QJ&lowbar;FileCenter)(系列三 访问接口与项目集成)

    系列文章 1. 开源一款强大的文件服务组件(QJ_FileCenter)(系列一) 2. 开源一款强大的文件服务组件(QJ_FileCenter)(系列二 安装说明) 3. 开源一款强大的文件服务组件 ...

  4. 一款开源免费的&period;NET文档操作组件DocX(&period;NET组件介绍之一)

    在目前的软件项目中,都会较多的使用到对文档的操作,用于记录和统计相关业务信息.由于系统自身提供了对文档的相关操作,所以在一定程度上极大的简化了软件使用者的工作量. 在.NET项目中如果用户提出了相关文 ...

  5. vue初学实践之路——vue简单日历组件&lpar;1&rpar;

    ---恢复内容开始--- 最近做的项目有一个需求,需要有一个日历组件供预定功能使用,之前的代码过于繁琐复杂,所以我采用vue重写了这个组件. npm.vue等等安装. 只是一个简单的日历组件,所以并不 ...

  6. 使用ant design vue的日历组件,实现一个简单交易日与非交易日的切换

    使用ant design vue的日历组件,实现一个简单交易日与非交易日的切换 需求: 日历区分交易日.非交易日 可以切换面板查看整年交易日信息 可以在手动调整交易日.非交易日 演示实例 序--使用软 ...

  7. 基于Vue的简单日历组件

    日历组件 由于移动端项目中需要用到日历组件,网上找了下,没看到几个合适的,就尝试着自己写一个.然后发现也不是很复杂,目前只做了最基本的功能,大家也可以拿去做做二次开发. 如何写一个日历组件 基础效果如 ...

  8. 9款精致HTML5&sol;jQuery日历时钟控件源码下载(源码请见百度云) 链接:http&colon;&sol;&sol;pan&period;baidu&period;com&sol;s&sol;1geIXe75 密码:7m4a

    现在的网页应用越来越丰富,我们在网页中填写日期和时间已经再也不用手动输入了,而是使用各种各样的日期时间选择控件,大部分样式华丽的日期选择和日历控件都是基于jQuery和HTML5的,比如今天要分享的这 ...

  9. 我的Android进阶之旅】GitHub 上排名前 100 的 Android 开源库进行简单的介绍

    GitHub Android Libraries Top 100 简介 本文转载于:https://github.com/Freelander/Android_Data/blob/master/And ...

随机推荐

  1. 用API网关把API管起来

    最开始只是想找个API网关防止API被恶意请求,找了一圈发现基于Nginx的OpenResty(Lua语言)扩展模块Orange挺好(也找了Kong,但是感觉复杂了点没用),还偷懒用Vagrant结合 ...

  2. ZeroMQ接口函数之 :zmq&lowbar;term - 终结ZMQ环境上下文(context)

    ZeroMQ 官方地址 :http://api.zeromq.org/4-0:zmq_term zmq_term(3) ØMQ Manual - ØMQ/4.1.0 Name zmq_term - 终 ...

  3. C&num; CsvFile 类

    using System; using System.Collections.Generic; using System.IO; using System.Linq; using System.Tex ...

  4. Android 2&period;3 不支持印度文

    Android 2.3 不支持印度文(hindi),即使你指定了相关的字符串也不行,它们一律显示为方格. 实际上,你在系统的语言设置界面也可以看到,印度文一行也是被显示为方格(既然是方格,如何知道它是 ...

  5. Swifter初体验;按照惯例,来一个Swift版本的:iOS图片验证码?

    不多解释,上图,上代码:代码

  6. hdu5178 尺取

    会爆int /* 给定数轴上一些点对,问有多少点对之间的距离差不超过k 点对排序后尺取法:枚举每个左边界,找到一个右边界使得 */ #include<bits/stdc++.h> #def ...

  7. 编译g&plus;&plus;后更新libstdc&plus;&plus;&period;so&period;6链接

    若不更新链接,运行时可能会发生错误: ./a.out: /usr/lib/libstdc++.so.6: version `GLIBCXX_3.4.14' not found (required by ...

  8. egret&period;Capabilities 在pc和移动端输出值

    egret.log("Device:", egret.Capabilities.os, App.DeviceUtils.IsWeb, App.DeviceUtils.isMobil ...

  9. Pycharm 2017 12月最新激活码

    激活的办法:这个必须的联网才可以使用(每次打开PyCharm都需要电脑联网才可以正常使用),要是没网的话,就不能激活使用啦,大家注意哈. http://idea.iteblog.com/key.php ...

  10. 准备看的ros相关源码

    进程通信:lcm 导航:navigation 3D可视化工具:rviz Mobile Robot Programming Toolkit:mrpt 其他: 人体肌肉:simbody openslam ...