jquery.cxcalendar 插件基本使用
<link href="~/Content/Calendar/css/jquery.cxcalendar.css" rel="stylesheet" />
<label>
选择年份
</label>
<select id="timeselect">
<option value="2019">2019</option>
<option value="2018">2018</option>
<option value="2017">2017</option>
<option value="2016">2016</option>
</select>
<label>选择日期</label>
<input type="text" data-start-date="2000" data-end-date="2019" data-format="YYYY/M/D" id="time1" />-<input type="text" id="time2" />
<script src="~/Content/assets/global/plugins/jquery.min.js"></script>
<script src="~/Content/Calendar/js/jquery.cxcalendar.min.js"></script>
<script src="~/Content/Calendar/js/jquery.cxcalendar.languages.js"></script>
<script type="text/javascript">
$(function () {
$("#timeselect").val(new Date().getFullYear());
var time1 = $("#time1");
var time2 = $("#time2");
time1.cxCalendar(function (api) {
time1Api = api;
time1Api.setOptions({
type: 'date',
format: 'YYYY-MM-DD',
baseClass: 'cxcalendar_notsecs',
});
});
time2.cxCalendar(function (api) {
time2Api = api;
time2Api.setOptions({
type: 'date',设置为datetime 会精确到分钟
format: 'YYYY-MM-DD',
baseClass: 'cxcalendar_notsecs'
});
});
time1.bind('change', function () {//联动
var vartime1 = parseInt(time1Api.getDate('TIME'), 10);
var timedate = time1Api.getDate('YYYY-MM-DD');
var vartime2 = parseInt(time2Api.getDate('TIME'), 10);
if (vartime2 < vartime1) {
time2Api.clearDate();
};
time2Api.setOptions({
startDate: startTimeDate
});
time2Api.show();
})
//$("#time1").cxCalendar();
});
</script>
jquery.cxcalendar 插件基本使用的更多相关文章
- jQuery cxCalendar 日期选择器
简介 cxCalendar 是基于 jQuery 的日期选择器插件. 它灵活自由,你可以自定义外观,日期的范围,返回的格式等. 版本: jQuery v1.7+ jQuery cxCalendar v ...
- 深入学习jQuery自定义插件
原文地址:jQuery自定义插件学习 1.定义插件的方法 对象级别的插件扩展,即为jQuery类的实例增加方法, 调用:$(选择器).函数名(参数); $(‘#id’).myPlugin(o ...
- [jQuery]jQuery DataTables插件自定义Ajax分页实现
前言 昨天在博客园的博问上帮一位园友解决了一个问题,我觉得有必要记录一下,万一有人也遇上了呢. 问题描述 园友是做前端的,产品经理要求他使用jQuery DataTables插件显示一个列表,要实现分 ...
- 使用jQuery.form插件,实现完美的表单异步提交
传送门:异步编程系列目录…… 时间真快,转眼一个月快结束了,一个月没写博客了!手开始生了,怎么开始呢…… 示例下载:使用jQuery.form插件,实现完美的表单异步提交.rar 月份的尾巴,今天的主 ...
- 为jQuery写插件
很多场合,我们都会调用jQuery的插件去完成某个功能,比如slider. 如下图,做一个div,通过“$( "#slider" ).slider();”的方式直接将div变成sl ...
- bootstrap-简洁实用的jQuery手风琴插件
前端 <html lang="zh"> <head> <meta charset="UTF-8"> <meta htt ...
- 推荐15款响应式的 jQuery Lightbox 插件
利用现代 Web 技术,网络变得越来越轻巧与.模态框是突出展现内容的重要形式,能够让用户聚焦到重要的内容上去.在这个列表中,我们编制了15款响应式的 jQuery 灯箱库,这将有助于开发人员创建和设计 ...
- Chocolat.js – 响应式的 jQuery Lightbox 插件
Chocolat.js 使您能够显示一个或多个图像在同一页面上.给用户展示一组图片缩略图,可以显示全页或块.Chocolat.js 可以很好地处理所有主要的浏览器.它在下面这些浏览器测试通过:IE7+ ...
- 让网站动起来!12款优秀的 jQuery 动画插件推荐
如今,大多数设计师和开发人员被要客户要求开发动态的网站.创造视觉震撼和醒目的动态网站是艰巨的任务,因为它需要大量的努力和创造力.在网络上有大量的工具和插件可用于创建网站动画.许多开发人员正在使用 HT ...
随机推荐
- ArchSummit全球架构师峰会2017年深圳站 漫谈
自去年6月跳槽到某CDN厂,从偏向移动端开发又回到了专注后端,关于做一个移动应用独立开发者的计划暂时搁置,但是如马云所讲: "梦想还是要有的,万一实现了呢".去年下半年辛苦加班加点 ...
- c# 中事务处理
1.在c#中,使用以下语句,就可以不用再数据库中进行事务语句处理了. TransactionOptions transactionOption = new TransactionOptions() ; ...
- Android Studio和eclipse混淆打包总结
最近项目有点闲,考虑到以前的项目没有做过混淆,只是用了加固软件进行加固,为了安全性,准备给项目加上,这里做个总结,都经本人亲自在项目实践,说是为了安全性,这好像说大了,一来项目中没用到什么特别的技术, ...
- Spring3 MVC 类型转换
1. Spring在进行类型转化都是基于java.beans.PropertyEditor接口. 2. 可以使用@InitBinder来进行对单个controller的类型进行操作,比如添加Date类 ...
- spring boot 配置文件application
场景:在项目部署的过程中,对于spring boot的配置文件一直不很了解,直到项目出现一个莫名其妙的问题——工程classes中的配置文件被覆盖,程序启动总是报错! 1 配置文件的优先级 appl ...
- vue.js使用props在父子组件之间传参
本篇文章是我参考官方文档整理的,供大家参考,高手勿喷! prop 组件实例的作用域是孤立的.这意味着不能 (也不应该) 在子组件的模板内直接引用父组件的数据.要让子组件使用父组件的数据,我们需要通过子 ...
- Android学习笔记-ScrollView(滚动条)
本节引言: 本节带来的是Android基本UI控件中的第十个:ScrollView(滚动条),或者我们应该叫他 竖直滚动条,对应的另外一个水平方向上的滚动条:HorizontalScrollView, ...
- Android学习笔记-EditText(输入框)(一)
1.设置默认提示文本 默认提示文本的两个属性如下: android:hint="默认提示文本" android:textColorHint="#95A1AA" ...
- 微服务(二)hystrix
特性 1.延迟和失败容忍 防止级联错误,错误回退,优雅降级.快速失败和恢复 线程和信号量隔离 2.实时监控和配置更改 3.并发 并行执行,请求缓存,自动批处理失败请求 总运行流程 当你发出请求后,hy ...
- [补档][ZJOI2007] 报表统计
[ZJOI2007] 报表统计 题目 传送门 小Q的妈妈是一个出纳,经常需要做一些统计报表的工作.今天是妈妈的生日,小Q希望可以帮妈妈分担一些工作,作为她的生日礼物之一. 经过仔细观察,小Q发现统计一 ...