easyui datebox 扩展 只显示年月
http://blog.csdn.net/zhaobao110/article/details/47755445
一个日期控件只显示年月是很正常的事情。可是easyui datebox 不支持这种格式的,要么就是截取字符串,不可取,自己没有写过类似的扩展,但是也算是实现功能了,先来张图吧
本人水平有限写不出高深的东西,代码大家都能看懂,但是还是贡献出来,让大家提提意见共同进步吧
$.extend($.fn.combobox.methods, {
yearandmonth: function (jq) {
return jq.each(function () {
var obj = $(this).combobox();
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth() + 1;
var table = $('<table>');
var tr1 = $('<tr>');
var tr1td1 = $('<td>', {
text: '-',
click: function () {
var y = $(this).next().html();
y = parseInt(y) - 1;
$(this).next().html(y);
}
});
tr1td1.appendTo(tr1);
var tr1td2 = $('<td>', {
text: year
}).appendTo(tr1);
var tr1td3 = $('<td>', {
text: '+',
click: function () {
var y = $(this).prev().html();
y = parseInt(y) + 1;
$(this).prev().html(y);
}
}).appendTo(tr1);
tr1.appendTo(table);
var n = 1;
for (var i = 1; i <= 4; i++) {
var tr = $('<tr>');
for (var m = 1; m <= 3; m++) {
var td = $('<td>', {
text: n,
click: function () {
var yyyy = $(table).find("tr:first>td:eq(1)").html();
var cell = $(this).html();
var v = yyyy + '-' + (cell.length < 2 ? '0' + cell : cell);
obj.combobox('setValue', v).combobox('hidePanel');
}
});
if (n == month) {
td.addClass('tdbackground');
}
td.appendTo(tr);
n++;
}
tr.appendTo(table);
}
table.addClass('mytable cursor');
table.find('td').hover(function () {
$(this).addClass('tdbackground');
}, function () {
$(this).removeClass('tdbackground');
});
table.appendTo(obj.combobox("panel"));
});
}
});
调用方法 $('#id').combobox('yearandmonth')
.mytable
{
padding: 0;
margin: 10px auto;
border-collapse: collapse;
font-family: @宋体;
empty-cells: show;
}
.mytable caption
{
font-size: 12px;
color: #0E2D5F;
height: 16px;
line-height: 16px;
border: 1px dashed red;
empty-cells: show;
}
.mytable tr th
{
border: 1px dashed #C1DAD7;
letter-spacing: 2px;
text-align: left;
padding: 6px 6px 6px 12px;
font-size: 13px;
height: 16px;
line-height: 16px;
empty-cells: show;
}
.mytable tr td
{
font-size: 12px;
border: 1px dashed #C1DAD7;
padding: 6px 6px 6px 12px;
empty-cells: show;
border-collapse: collapse;
}
.cursor
{
cursor: pointer;
}
.tdbackground
{
background-color: #FFE48D;
}
easyui datebox 扩展 只显示年月的更多相关文章
- easyui的datebox只显示年月
要求点击easyui的datebox时只显示年月,隐藏日,之前百度了好多,发现有的好麻烦,有的使用没效果,也许自己没理解,改不了.最后老员工帮我搞定了,添加一个fomatter和一个parser函数就 ...
- easyui datebox时间控件如何只显示年月
easyui datebox控件,只显示年月,不显示年月日 需要的效果图如下: 具体的js代码: <script> $(function(){ intiMonthBox('costTime ...
- 自定义一个只显示年月的DatePicker(UIDatePicker无法实现年月显示)
HooDatePicker 介绍(introduction) ==================================================项目需要一个DatePicker,只显 ...
- zui框架配置日期控件只显示年月
zui框架配置日期控件datetimepicker只显示年月 <!DOCTYPE html> <head> <script src="~/Scripts/jqu ...
- 转 EasyUi日期控件datebox设置,只显示年月,也只能选择年月
1.引入Jquery和easyui,注低版本的Jquery和easy不能使用,这里使用的Jquery是1.8.2easyui是1.6.1.1.easyui下载地址:http://www.jeasyui ...
- JQuery EasyUI 日期控件 怎样做到只显示年月,而不显示日
标题问题的答案在OSChina中 http://www.oschina.net/question/2282354_224401?fromerr=lHJTcN89 我还是把这个记录下来 ======== ...
- EasyUI Calendar 日历插件,只显示年月。
从别人的博客园搬过来的,放在这里只是为了方便自己用.已经注明原文出处,尊重别人的劳动成果. 原文地址:http://www.cnblogs.com/hmYao/p/5779463.html 此日历插件 ...
- easyui只显示年月,时间格式
<div > <input id="db" /> </div> <script> /*power by showbo http:// ...
- easyui时间框只选择年月
html: <input type="text" id="datetime" > js: <script type="text/ja ...
随机推荐
- FICO(费埃哲)评分系统有什么优缺点?在国内的发展怎么样?
权威回答: FICO的优点很明显: 在美国数据库较全面.一般存储有最近7-10年的个人信用记录,包括银行信用.商业信用甚至保险等. 客观性.计算机自动完成评估工作,克服人为操作的失误. 快捷性.出结果 ...
- ffplay.exe操作方式
大牛博客: 博文名称:[总结]FFMPEG视音频编解码零基础学习方法 博文链接:http://blog.csdn.net/leixiaohua1020/article/details/15811977 ...
- notion笔记
不错的笔记应用, 模式新颖, 正在使用, 如有相同使用者可以入群交流 notion QQ群 725638123
- Java面向对象程序设计
北京电子科技学院(BESTI) 实 ...
- Task 8 找水王
任务: 三人行设计了一个灌水论坛.信息学院的学生都喜欢在上面交流灌水,传说在论坛上有一个“水王”,他不但喜欢发帖,还会回复其他ID发的每个帖子.坊间风闻该“水王”发帖数目超过了帖子数目的一半. 如果你 ...
- 【动态规划】POJ-2229
一.题目 Description Farmer John commanded his cows to search for different sets of numbers that sum to ...
- 【CSAPP笔记】5. 汇编语言——数据
本博客对于汇编的介绍基于32位机器的Intel x86系列处理器和IA32指令集,也涉及少部分x86-64.由于汇编知识相对复杂,这里只做简单介绍和记录,详细请参照书本! 数据格式 下面这张表格中体现 ...
- Unity3D游戏开发——收集当前关卡游戏中分散的物件
运用场景 许多游戏中会有一些供玩家拾起的物件,例如装备.血包.道具等.当玩家与物件进行碰撞后,则会进入仓库. 本篇介绍了简单的碰撞过程. 原理 基本的碰撞机制,用到OnTriggerEnter()碰撞 ...
- 关于SVM数学细节逻辑的个人理解(一) :得到最大间隔分类器的基本形式
网上,书上有很多的关于SVM的资料,但是我觉得一些细节的地方并没有讲的太清楚,下面是我对SVM的整个数学原理的推导过程,其中逻辑的推导力求每一步都是有理有据.现在整理出来和大家讨论分享. 因为目前我的 ...
- 使用WinSW 将 exe 创建成Windows下面 service的方法 (将nginx创建成 services)
1. 使用winsw工具能够将部分exe 创建成服务, 这样可以很简单的创建nginx的服务, 避免每次需要执行相应的命令. 2. 方法,下载 工具 地址 github https://github. ...