http://blog.csdn.net/littlewolf766/article/details/7329123

项目里需要显示自定义显示格式,比如只显示yyy,yyyy-mm,yyyy-mm-dd等格式。直接设置formatter参数的话,总是报错。用firefox调试后发现,好像在设置新的日期时

datetimebox控件会调用默认的parser指定的函数,把字符串转为日期格式。由于默认的只认"yyyy-MM-dd hh:mm:ss"格式(可以是其它分隔符,并非一定要是'-'),所以如果formatter函数返回的不是这个格式,会报错。

下面是我自己的实现方式:

datetimebox 设置:

  1. //加载日期控件
  2. function loadDate() {
  3. startDTObj = $("#startDate");
  4. endDTObj = $("#endDate");
  5. startDTObj.datetimebox({
  6. showSeconds:false,
  7. formatter: formatDateText,
  8. parser: parseDate
  9. });
  10. endDTObj.datetimebox({
  11. showSeconds:false,
  12. formatter: formatDateText,
  13. parser: parseDate
  14. });
  15. }
  1. /格式化显示的文本
  2. function formatDateText(date) {
  3. var rainType = rainTypeObj.combobox("getValue");
  4. switch (rainType) {
  5. case '0':
  6. return date.formatDate("yyyy-MM-dd hh:mm");
  7. break;
  8. case '1':
  9. return date.formatDate("yyyy-MM-dd hh");
  10. break;
  11. case '2':
  12. return date.formatDate("yyyy-MM-dd");
  13. break;
  14. case '3':
  15. return date.formatDate("yyyy-MM");
  16. break;
  17. case '4':
  18. return date.formatDate("yyyy-MM");
  19. break;
  20. case '5':
  21. return date.formatDate("yyyy");
  22. break;
  23. default:
  24. break;
  25. }
  26. }

本菜鸟写的,由于js,正则不是很熟,写得不好。月,日默认使用‘01’,时间部分默认使用‘00’

  1. //把时间格式字符串转化为时间
  2. //如下格式
  3. //2006
  4. //2006-01
  5. //2006-01-01
  6. //2006-01-01 12
  7. //2006-01-01 12:12
  8. //2006-01-01 12:12:12
  9. function parseDate(dateStr) {
  10. var regexDT = /(\d{4})-?(\d{2})?-?(\d{2})?\s?(\d{2})?:?(\d{2})?:?(\d{2})?/g;
  11. var matchs = regexDT.exec(dateStr);
  12. var date = new Array();
  13. for (var i = 1; i < matchs.length; i++) {
  14. if (matchs[i]!=undefined) {
  15. date[i] = matchs[i];
  16. } else {
  17. if (i<=3) {
  18. date[i] = '01';
  19. } else {
  20. date[i] = '00';
  21. }
  22. }
  23. }
  24. return new Date(date[1], date[2]-1, date[3], date[4], date[5],date[6]);
  25. }

网上找的别人写的格式化日期的方法,很好用

  1. //为date类添加一个format方法
  2. //yyyy 年
  3. //MM 月
  4. //dd 日
  5. //hh 小时
  6. //mm 分
  7. //ss 秒
  8. //qq 季度
  9. //S  毫秒
  10. Date.prototype.formatDate = function (format) //author: meizz
  11. {
  12. var o = {
  13. "M+": this.getMonth() + 1, //month
  14. "d+": this.getDate(),    //day
  15. "h+": this.getHours(),   //hour
  16. "m+": this.getMinutes(), //minute
  17. "s+": this.getSeconds(), //second
  18. "q+": Math.floor((this.getMonth() + 3) / 3),  //quarter
  19. "S": this.getMilliseconds() //millisecond
  20. }
  21. if (/(y+)/.test(format)) format = format.replace(RegExp.$1,
  22. (this.getFullYear() + "").substr(4 - RegExp.$1.length));
  23. for (var k in o) if (new RegExp("(" + k + ")").test(format))
  24. format = format.replace(RegExp.$1,
  25. RegExp.$1.length == 1 ? o[k] :
  26. ("00" + o[k]).substr(("" + o[k]).length));
  27. return format;
  28. }

完成后效果:

easyUI datetimebox 自定义显示格式的更多相关文章

  1. Js:消息弹出框、获取时间区间、时间格式、easyui datebox 自定义校验、表单数据转化json、控制两个日期不能只填一个

    (function ($) { $.messageBox = function (message) { $.messager.show({ title:'消息框提示', msg:message, sh ...

  2. 雷林鹏分享:jQuery EasyUI 窗口 - 自定义窗口工具栏

    jQuery EasyUI 窗口 - 自定义窗口工具栏 默认情况下,窗口(window)有四个工具:collapsible.minimizable.maximizable 和 closable.比如我 ...

  3. 雷林鹏分享:jQuery EasyUI 窗口 - 自定义带有工具条和按钮的对话框

    jQuery EasyUI 窗口 - 自定义带有工具条和按钮的对话框 您可以创建一个带有工具栏(toolbar)和按钮(button)的对话框(dialog),可以从 HTML 标记创建.这个教程描述 ...

  4. 表单(中)-EasyUI Combogrid 组合网格、EasyUI Numberbox 数字框、EasyUI Datebox 日期框、EasyUI Datetimebox 日期时间框、EasyUI Calendar 日历

    EasyUI Combogrid 组合网格 扩展自 $.fn.combo.defaults 和 $.fn.datagrid.defaults.通过 $.fn.combogrid.defaults 重写 ...

  5. EasyUI Datagrid 自定义列、Foolter及单元格编辑

    1:自定义列,包括 Group var head1Array = []; head1Array.push({ field: 'Id', title: 'xxxx', rowspan: 2 }); he ...

  6. easyui DateTimeBox OK

    一.datetimebox   ok按钮没有点击事件,但是可以通过onSelect事件模拟出“点击了ok按钮一样的效果”,我的代码: 关键: 0,理解DateTimeBox控件,这个控件是由DateB ...

  7. easyui datagrid自定义操作列

    通过formatter方法给Jquery easyui 的datagrid 每行增加操作链接 我们都知道Jquery的EasyUI的datagrid可以添加并且自定义Toolbar, 这样我们选择一行 ...

  8. easyui datagrid自定义按钮列,即最后面的操作列(转)

    做项目的时候因为需求,要在表格的最后添加一列操作列,easyUI貌似没有提供这种功能,不过没关系,我们可以自定义来实现 版本:jQuery easyUI 1.3.2 这里我的实现方式是采用HTML形式 ...

  9. easyui之自定义字体图标(鼠标覆盖时切换颜色)

    项目要求是自定义字体图标,使用easyui框架结构,众所周知easyui强功能弱样式,字体图标其实就是一张图片.要达到切换图标颜色的效果,要么就是有两套图,使用js控制.但是我这个人比较懒,不喜欢做复 ...

随机推荐

  1. thrift0.5入门操作

    在探索未知的程序之前,我们往往会使用“Hello World”这个经典的输出作为测试,为了遵循这个惯例,作为thrift菜鸟都不算的一员,决定跑一下“Hello world”正式进入菜鸟的行列. th ...

  2. resize2fs命令详解

    基础命令学习目录首页 原文链接:http://blog.51cto.com/woyaoxuelinux/1870299   resize2fs:调整ext文件系统的空间大小  搭配逻辑卷lv使用方法: ...

  3. java的第二个实验——JAVA面向对象程序设计

    java的第二个实验——JAVA面向对象程序设计 北京电子科技学院 实     验    报     告 课程:Java程序设计 班级:1352 姓名:林涵锦 学号:20135213 成绩:      ...

  4. web05-CounterServlet

    电影网站:www.aikan66.com 项目网站:www.aikan66.com 游戏网站:www.aikan66.com 图片网站:www.aikan66.com 书籍网站:www.aikan66 ...

  5. 《找出1到正整数N中出现1的次数》

    <找出1到正整数N中出现1的次数> 编程思想:依次求出正整数每个位数上出现1的次数,累加即可得到最后想要的结果:而每一位上出现1的个数与和它相邻的其它位数上的数字有关系(以此位置上的数为对 ...

  6. Linux系统(X32)安装Oracle11g完整安装图文教程另附基本操作

    一.修改操作系统核心参数 在Root用户下执行以下步骤: )修改用户的SHELL的限制,修改/etc/security/limits.conf文件 输入命令:vi /etc/security/limi ...

  7. C#和.net框架

    第一章C#和.net框架 c#只是.net的一部分,.net不只包含C#.C#是一种程序语言,.net是一个框架/平台 C#和.NET框架 在.NET之前 20世纪90年代,微软平台多数程序员使用VB ...

  8. Apollo配置名词-学习1

    文章:Apollo分布式配置中心部署以及使用 部署环境为DEV(开发环境).FAT(测试环境).UAT(预生产).PRO(生产)

  9. grunt入门讲解5:创建插件,安装Grunt以及常见问题

    创建插件 创建插件主要有以下几个步骤: (1)通过 npm install -g grunt-init 命令安装 grunt-init .(2)通过 git clone git://github.co ...

  10. [2017BUAA软工]第3次个人作业

    软工第3次个人作业--案例分析 一. 调研,评测 1.软件的bug(至少两个,不少于40字) 测试软件: 必应词典移动端 测试平台:iPhone 6 bug1 对于翻译功能中的图片翻译功能,必应词典是 ...