问题描述： 根据jquery easyui datebox demo中给的示例，导入和使用datebox, 发现日期格式为： 6/22/2011， 其他的今天和关闭也是 Today, Close， 对中文用户有些不习惯。
期待效果： 日期格式 2011-06-22  今天 关闭
解决方案：  导入 <script type="text/javascript" src="../locale/easyui-lang-zh_CN.js"></script> 运用国际化定义解决此问题。

最近项目开发中要使用到日期选择框，由于使用了jquery，所以准备使用jquery easyui中的ui控件，找到他的主页，查看datebox的用法：
地址：http://www.jeasyui.com/documentation/datebox.php

Usage

[html] view plaincopy

  1. <input id="dd" type="text"></input>
[javascript] view plaincopy

  1. $('#dd').datebox({
  2. required:true
  3. });

的确很容易就可以弹出日期选择框了。使用的时候发现，她的日期选择框选择的日期格式如图：


日期格式为： 6/22/2011 ，我们平常喜欢使用的格式是“2011-06-22”， 同时 Today, Close 都为英文，要是能改成中文就好了。
于是开始求助百度，找到解决方案有以下两种：

1、在自己的jsp文件里，重载她的方法： formatter 和 parser.

[javascript] view plaincopy

  1. <script>
  2. $('#dd').datebox({
  3. closeText:'关闭',
  4. formatter:function(date){
  5. var y = date.getFullYear();
  6. var m = date.getMonth()+1;
  7. var d = date.getDate();
  8. var h = date.getHours();
  9. var M = date.getMinutes();
  10. var s = date.getSeconds();
  11. function formatNumber(value){
  12. return (value < 10 ? '0' : '') + value;
  13. }
  14. alert(formatNumber(h));
  15. return y+'-'+m+'-'+d+' '+ formatNumber(h)+':'+formatNumber(M)+':'+formatNumber(s);
  16. },
  17. parser:function(s){
  18. var t = Date.parse(s);
  19. if (!isNaN(t)){
  20. return new Date(t);
  21. } else {
  22. return new Date();
  23. }
  24. }
  25. });
  26. </script>

有个哥们儿建议的方案是这样，的却这样可以实现修改选择日期格式为：  2011-06-22  中文汉字等功能，但是每个页面都要加这么一个函数怪费劲的，于是想想能不能来个全局的修改，不就省事儿了吗？改一次，全部都可以用。于是找到了第二个解决方案。
第一个方案地址：  http://zzx19452008-163-com.iteye.com/blog/894150

2、修改jquery easyui 的源代码

[javascript] view plaincopy

  1. //------------------格式化时间为 yyyy-MM-dd ---------------------------------------
  2. $.fn.datebox.defaults.formatter = function(date) {
  3. var y = date.getFullYear();
  4. var m = date.getMonth() + 1;
  5. var d = date.getDate();
  6. return y + '-' + (m < 10 ? '0' + m : m) + '-' + (d < 10 ? '0' + d : d);
  7. };
  8. //
  9. $.fn.datebox.defaults.parser = function(s) {
  10. if (s) {
  11. var a = s.split('-');
  12. var d = new Date(parseInt(a[0]), parseInt(a[1]) - 1, parseInt(a[2]));
  13. return d;
  14. } else {
  15. return new Date();
  16. }
  17. };
  18. 直接加到 jquery.easyui.min.js 最后就可以了，然后找到  $.fn.calendar.defaults  修改为如下格式就OK了。
  19. $.fn.calendar.defaults = {width:180, height:180, fit:false, border:true, weeks:["一", "二", "三", "四", "五", "六", "日"], months:["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"], year:new Date().getFullYear(), month:new Date().getMonth() + 1, current:new Date(), onSelect:function (_6f) {
  20. }};

觉得这个方案挺好的，修改一次可以全部搞定，虽然有点侵入性。但是不管了，能解决问题就是王道。改完之后，发现没多大反应，解决方案失败。
第二个方案地址： http://www.iteye.com/topic/855905

在修改源代码的过程中，偶然发现在/locale/easyui-lang-zh_CN.js文件里居然有我们要修改的内容，这是什么情况？
难道是搞得国际化多国语言支持？官网上给的demo示例，没有导入国际化的支持啊，试试吧，也许行呢？

源文件里的 datebox demo示例：

[html] view plaincopy

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <title>DateBox - jQuery EasyUI Demo</title>
  6. <span style="background-color: rgb(153, 255, 255); "><link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
  7. <link rel="stylesheet" type="text/css" href="../themes/icon.css">
  8. <link rel="stylesheet" type="text/css" href="demo.css">
  9. <script type="text/javascript" src="../jquery-1.7.2.min.js"></script>
  10. <script type="text/javascript" src="../jquery.easyui.min.js"></script></span>
  11. <script>
  12. function disable(){
  13. $('#dd').datebox('disable');
  14. }
  15. function enable(){
  16. $('#dd').datebox('enable');
  17. }
  18. </script>
  19. </head>
  20. <body>
  21. <h2>DateBox</h2>
  22. <div class="demo-info">
  23. <div class="demo-tip icon-tip"></div>
  24. <div>Allow you to select date in your form.</div>
  25. </div>
  26. <div style="margin:10px 0;">
  27. <a href="#" class="easyui-linkbutton" onclick="disable()">Disable</a>
  28. <a href="#" class="easyui-linkbutton" onclick="enable()">Enable</a>
  29. </div>
  30. <input id="dd" class="easyui-datebox" required="true"></input>
  31. </body>
  32. </html>

加入/locale/easyui-lang-zh_CN.js：

[javascript] view plaincopy

  1. <script type="text/javascript" src="../locale/easyui-lang-zh_CN.js"></script>

选择日期。居然得到想要的格式。见图片：

ok, 问题解决。真是感叹这外国人的架构原来设计的这么好用，佩服！

转自：http://blog.csdn.net/walkerjong/article/details/7514026

修改easyui datebox默认日期格式的更多相关文章

  1. EasyUI修改DateBox和DateTimeBox的默认日期格式

      最近整理Easyui控件的时候,对Easyui的DateBox控件和DateTimeBox控件进行了梳理,而我之所以将EasyUI的DateBox控件和DateTimeBox控件放在一起,归为一类 ...

  2. EasyUI改动DateBox和DateTimeBox的默认日期格式

    近期整理Easyui控件的时候,对Easyui的DateBox控件和DateTimeBox控件进行了梳理,而我之所以将EasyUI的DateBox控件和DateTimeBox控件放在一起,归为一类,是 ...

  3. Oracle修改时间报:ORA-01830: 日期格式图片在转换整个输入字符串之前结束的解决办法

    1.错误原因: date类型不能包含秒以后的精度. 如日期:2010-01-01 20:02:20.0 解决方法:将日期秒以后的精度去除, to_date(substr(INVOICE_DATE,1, ...

  4. Flex 将默认日期格式转化成通用格式

    flex 默认日期格式如:Wed Dec 16 00:00:00 GMT+0800 2015 想要得到的通用格式如:2015-12-16 转换方法如下: var sdate:String = &quo ...

  5. oracle默认日期格式

    有关 Oracle 数据库中支持的语言的完整列表,以及与区域设置相关的信息细节,请参阅 Oracle Database Globalization Support Guide. 默认日期格式 小时.日 ...

  6. easyui datebox 年月 yyyyMM 格式

    //js日期重写ny为 function formatTime(ny){ var p = ny.datebox('panel'), //日期选择对象 tds = false, //日期选择对象中月份 ...

  7. 修改oracle数据库默认时间格式

    原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://ccchencheng.blog.51cto.com/2419062/929695 ...

  8. 修改easyui panel 默认样式

    有这么个需求需要修改easyui panel头部中的背景色.于是根据panel中的最终被浏览器解析出来的类名,直接修改这个css样式,设置backgroud-color这个属性,发现不管用. 于是,就 ...

  9. 使用EasyUI，关于日期格式的文本框按照正常方式获取不到值的问题

    这是个小菜在实际工作中遇到的问题,相信很多EasyUI新手很可能也遇到这样的问题,因此小菜觉得有必要拿出来分享一下. 这个问题要从EasyUI的datebox组件说起,小菜用这个组件的时候,发现用$( ...

随机推荐

  1. C++ Primer 学习笔记_32_STL实践与分析（6） --再谈string类型（下）

    STL实践与分析 --再谈string类型(下) 四.string类型的查找操作 string类型提供了6种查找函数,每种函数以不同形式的find命名.这些操作所有返回string::size_typ ...

  2. 解决xShell4某些情况下按删除键会输出^H的问题

    当我们用Xshell登录进入linux后,在普通模式下,对输入进行删除等操作没有问题. 而在执行中,按delete,backspace键时会产生^H等乱码问题. 这是由于编码不匹配的问题. 解决方法: ...

  3. （Google面试题）有四个线程1、2、3、4。线程1的功能就是输出1，线程2的功能就是输出2，以此类推.........现在有四个文件ABCD。初始都为空。

    现要让四个文件呈如下格式: A:1 2 3 4 1 2.... B:2 3 4 1 2 3.... C:3 4 1 2 3 4.... D:4 1 2 3 4 1.... 请设计程序. 下面举例A,对 ...

  4. Android万能适配器base-adapter-helper的源代码分析

    项目地址:https://github.com/JoanZapata/base-adapter-helper 1. 功能介绍 1.1. base-adapter-helper base-adapter ...

  5. 【ASP.NET】验证控件

    在软件开发中,验证输入信息是否正确,这是不可缺少的一项工作.就拿我们做过的机房收费系统来说,在登录的时候,我们须要对username和用户password进行验证.推断是否为空,推断输入字符是否合理等 ...

  6. 第27本：《学得少却考得好Learn More Study Less》

    第27本:<学得少却考得好Learn More Study Less> <学得少却考得好Learn More Study Less>这本书最早是从褪墨网站上看到的,crownc ...

  7. TMG 2010 VPN配置

    微软的ISA 到2006以后就叫TMG了,上周在公司的服务器上安装测试了下,虽然增加了很多功能,但是主要功能上和ISA 2004差不多,最近在部署L2TP VPN,由于防火墙带的远程访问VPN为纯的L ...

  8. Linux lamp环境编译安装

    1.安装准备: 1)httpd-2.0.52.tar.gz 2)mysql-4.1.12.tar.gz 3)libxml2-2.6.27.tar 4)freetype-2.1.10.tar 5)gd- ...

  9. SE 2014年5月25日

    如图配置 两实验 R1模拟总部,R2 与R3模拟分部 实验一  要求使用 IPSec VPN 主模式,使得总部与两分部内网可相互通讯 步骤: 1.  配置默认路由 [RT1]ip route-stat ...

  10. 转：svn命令行操作

    原文:http://zhumeng8337797.blog.163.com/blog/static/10076891420115218821912/SVN命令行 -- ::| 分类: CVS |字号 ...