源码会在最后给出地址,需要的朋友自己去下载。最近项目需要做一个日程安排的功能,就是点击日历的某一天弹出一个录入页面,填完信息后保存当天的日程安排。有日程的日期会有不同的标记(比如加一个背景色啥的)。网上找了很久,都不尽如人意,于是我只好自己找点资料弄了一个。具体的页面就不给出了,关于这个日历,现在是一个单独的js组件,分享出来。
调用方法:首先你的页面需要有一个div,id自己定义。
比如:
<div id="wannianli"></div>
js代码:
var calender = new Calender(opts);
calender.init();
属性
方法
范例:
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版的的更多相关文章
-
开源一款强大的文件服务组件(QJ_FileCenter)(系列一)
系列文章 1. 开源一款强大的文件服务组件(QJ_FileCenter)(系列一) 2. 开源一款强大的文件服务组件(QJ_FileCenter)(系列二 安装说明) 3. 开源一款强大的文件服务组件 ...
-
开源一款强大的文件服务组件(QJ_FileCenter)(系列二 安装说明)
系列文章 1. 开源一款强大的文件服务组件(QJ_FileCenter)(系列一) 2. 开源一款强大的文件服务组件(QJ_FileCenter)(系列二 安装说明) 3. 开源一款强大的文件服务组件 ...
-
开源一款强大的文件服务组件(QJ_FileCenter)(系列三 访问接口与项目集成)
系列文章 1. 开源一款强大的文件服务组件(QJ_FileCenter)(系列一) 2. 开源一款强大的文件服务组件(QJ_FileCenter)(系列二 安装说明) 3. 开源一款强大的文件服务组件 ...
-
一款开源免费的.NET文档操作组件DocX(.NET组件介绍之一)
在目前的软件项目中,都会较多的使用到对文档的操作,用于记录和统计相关业务信息.由于系统自身提供了对文档的相关操作,所以在一定程度上极大的简化了软件使用者的工作量. 在.NET项目中如果用户提出了相关文 ...
-
vue初学实践之路——vue简单日历组件(1)
---恢复内容开始--- 最近做的项目有一个需求,需要有一个日历组件供预定功能使用,之前的代码过于繁琐复杂,所以我采用vue重写了这个组件. npm.vue等等安装. 只是一个简单的日历组件,所以并不 ...
-
使用ant design vue的日历组件,实现一个简单交易日与非交易日的切换
使用ant design vue的日历组件,实现一个简单交易日与非交易日的切换 需求: 日历区分交易日.非交易日 可以切换面板查看整年交易日信息 可以在手动调整交易日.非交易日 演示实例 序--使用软 ...
-
基于Vue的简单日历组件
日历组件 由于移动端项目中需要用到日历组件,网上找了下,没看到几个合适的,就尝试着自己写一个.然后发现也不是很复杂,目前只做了最基本的功能,大家也可以拿去做做二次开发. 如何写一个日历组件 基础效果如 ...
-
9款精致HTML5/jQuery日历时钟控件源码下载(源码请见百度云) 链接:http://pan.baidu.com/s/1geIXe75 密码:7m4a
现在的网页应用越来越丰富,我们在网页中填写日期和时间已经再也不用手动输入了,而是使用各种各样的日期时间选择控件,大部分样式华丽的日期选择和日历控件都是基于jQuery和HTML5的,比如今天要分享的这 ...
-
我的Android进阶之旅】GitHub 上排名前 100 的 Android 开源库进行简单的介绍
GitHub Android Libraries Top 100 简介 本文转载于:https://github.com/Freelander/Android_Data/blob/master/And ...
随机推荐
-
用API网关把API管起来
最开始只是想找个API网关防止API被恶意请求,找了一圈发现基于Nginx的OpenResty(Lua语言)扩展模块Orange挺好(也找了Kong,但是感觉复杂了点没用),还偷懒用Vagrant结合 ...
-
ZeroMQ接口函数之 :zmq_term - 终结ZMQ环境上下文(context)
ZeroMQ 官方地址 :http://api.zeromq.org/4-0:zmq_term zmq_term(3) ØMQ Manual - ØMQ/4.1.0 Name zmq_term - 终 ...
-
C# CsvFile 类
using System; using System.Collections.Generic; using System.IO; using System.Linq; using System.Tex ...
-
Android 2.3 不支持印度文
Android 2.3 不支持印度文(hindi),即使你指定了相关的字符串也不行,它们一律显示为方格. 实际上,你在系统的语言设置界面也可以看到,印度文一行也是被显示为方格(既然是方格,如何知道它是 ...
-
Swifter初体验;按照惯例,来一个Swift版本的:iOS图片验证码?
不多解释,上图,上代码:代码
-
hdu5178 尺取
会爆int /* 给定数轴上一些点对,问有多少点对之间的距离差不超过k 点对排序后尺取法:枚举每个左边界,找到一个右边界使得 */ #include<bits/stdc++.h> #def ...
-
编译g++后更新libstdc++.so.6链接
若不更新链接,运行时可能会发生错误: ./a.out: /usr/lib/libstdc++.so.6: version `GLIBCXX_3.4.14' not found (required by ...
-
egret.Capabilities 在pc和移动端输出值
egret.log("Device:", egret.Capabilities.os, App.DeviceUtils.IsWeb, App.DeviceUtils.isMobil ...
-
Pycharm 2017 12月最新激活码
激活的办法:这个必须的联网才可以使用(每次打开PyCharm都需要电脑联网才可以正常使用),要是没网的话,就不能激活使用啦,大家注意哈. http://idea.iteblog.com/key.php ...
-
准备看的ros相关源码
进程通信:lcm 导航:navigation 3D可视化工具:rviz Mobile Robot Programming Toolkit:mrpt 其他: 人体肌肉:simbody openslam ...