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 ...
随机推荐
- FileInputStreamTest
package JBJADV003;import java.io.FileNotFoundException;import java.io.IOException;import java.io.Inp ...
- 谈谈tableView的重要属性内边距
全屏穿透效果需要做到两点 tableView的可视范围占据整个父控件(或者屏幕)--设置contentsize滚动范围. 所有的cell都可以被看到,也就是说tableView中的cell不会被导航栏 ...
- 关于Win7 内存变小处理方法
windows + R 输入msconfig 点击引导 点击高级选项 点击最大内存打钩,就好了,你重启,你的内存将恢复成原来的.
- 解决win10系统以太网适配器的驱动程序可能出现问题
插上网线显示未连接-连接可用,连上无线显示未连接-连接不可用,右下角显示感叹号 ,以太网和无线属性显示ipv4未连接详细信息为空,在设备管理器里卸载网卡驱动重装上仍然没有,通过windoes自带的网络 ...
- centos 6.5系统判断软件是否安装,如果没安装,则直接使用yum安装,并添加启动项
function install_software(){ software=$1 s=`rpm -qa|grep ${software}` result=$(echo ${s}|grep ${soft ...
- (转)log4j(四)——如何控制不同风格的日志信息的输出?
一:测试环境与log4j(一)——为什么要使用log4j?一样,这里不再重述 1 老规矩,先来个栗子,然后再聊聊感受 import org.apache.log4j.*; //by godtrue p ...
- (转)java之runnable jar与普通jar
背景:项目中有时候需要导出相关的jar包,可是总是不能分清楚. 1 导出包 导出普通jar包(可作为第三方库,类似dll,so等) 在eclipse中右键选择except->java->j ...
- (转)Spring boot——logback.xml 配置详解(四)<filter>
文章转载自:http://aub.iteye.com/blog/1101260,在此对作者的辛苦表示感谢! 1 filter的使用 <filter>: Logback的过滤器基于三值逻辑( ...
- php+sqlserver实现分页效果
找了一些实现的代码,都或多或少有点问题. 主要问题在于: 在进行一页数据查询时的sql语句格式问题, 开始尝试使用limit关键字查询,错误,limit用于mysql: 接着使用ROWNUM.row_ ...
- 灵玖软件NLPIRParser智能文本聚类
随着互联网的迅猛发展,信息的爆炸式增加,信息超载问题变的越来越严重,信息的更新率也越来越高,用户在信息海洋里查找信息就像大海捞针一样.搜索引擎服务应运而生,在一定程度上满足了用户查找信息的需要.然而互 ...