批改easyui datebox默认日期格式
修改easyui datebox默认日期格式
问题描述: 根据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
- <input id="dd" type="text"></input>
- $('#dd').datebox({
- required:true
- });
的确很容易就可以弹出日期选择框了。使用的时候发现,她的日期选择框选择的日期格式如图:
日期格式为: 6/22/2011 ,我们平常喜欢使用的格式是“2011-06-22”, 同时 Today, Close 都为英文,要是能改成中文就好了。
于是开始求助百度,找到解决方案有以下两种:
1、在自己的jsp文件里,重载她的方法: formatter 和 parser.
- <script>
- $('#dd').datebox({
- closeText:'关闭',
- formatter:function(date){
- var y = date.getFullYear();
- var m = date.getMonth()+1;
- var d = date.getDate();
- var h = date.getHours();
- var M = date.getMinutes();
- var s = date.getSeconds();
- function formatNumber(value){
- return (value < 10 ? '0' : '') + value;
- }
- alert(formatNumber(h));
- return y+'-'+m+'-'+d+' '+ formatNumber(h)+':'+formatNumber(M)+':'+formatNumber(s);
- },
- parser:function(s){
- var t = Date.parse(s);
- if (!isNaN(t)){
- return new Date(t);
- } else {
- return new Date();
- }
- }
- });
- </script>
有个哥们儿建议的方案是这样,的却这样可以实现修改选择日期格式为: 2011-06-22 中文汉字等功能,但是每个页面都要加这么一个函数怪费劲的,于是想想能不能来个全局的修改,不就省事儿了吗?改一次,全部都可以用。于是找到了第二个解决方案。
第一个方案地址: http://zzx19452008-163-com.iteye.com/blog/894150
2、修改jquery easyui 的源代码
- //------------------格式化时间为 yyyy-MM-dd ---------------------------------------
- $.fn.datebox.defaults.formatter = function(date) {
- var y = date.getFullYear();
- var m = date.getMonth() + 1;
- var d = date.getDate();
- return y + '-' + (m < 10 ? '0' + m : m) + '-' + (d < 10 ? '0' + d : d);
- };
- //
- $.fn.datebox.defaults.parser = function(s) {
- if (s) {
- var a = s.split('-');
- var d = new Date(parseInt(a[0]), parseInt(a[1]) - 1, parseInt(a[2]));
- return d;
- } else {
- return new Date();
- }
- };
- 直接加到 jquery.easyui.min.js 最后就可以了,然后找到 $.fn.calendar.defaults 修改为如下格式就OK了。
- $.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) {
- }};
觉得这个方案挺好的,修改一次可以全部搞定,虽然有点侵入性。但是不管了,能解决问题就是王道。改完之后,发现没多大反应,解决方案失败。
第二个方案地址: http://www.iteye.com/topic/855905
在修改源代码的过程中,偶然发现在/locale/easyui-lang-zh_CN.js文件里居然有我们要修改的内容,这是什么情况?
难道是搞得国际化多国语言支持?官网上给的demo示例,没有导入国际化的支持啊,试试吧,也许行呢?
源文件里的 datebox demo示例:
- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- <title>DateBox - jQuery EasyUI Demo</title>
- <span style="background-color: rgb(153, 255, 255); "><link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
- <link rel="stylesheet" type="text/css" href="../themes/icon.css">
- <link rel="stylesheet" type="text/css" href="demo.css">
- <script type="text/javascript" src="../jquery-1.7.2.min.js"></script>
- <script type="text/javascript" src="../jquery.easyui.min.js"></script></span>
- <script>
- function disable(){
- $('#dd').datebox('disable');
- }
- function enable(){
- $('#dd').datebox('enable');
- }
- </script>
- </head>
- <body>
- <h2>DateBox</h2>
- <div class="demo-info">
- <div class="demo-tip icon-tip"></div>
- <div>Allow you to select date in your form.</div>
- </div>
- <div style="margin:10px 0;">
- <a href="#" class="easyui-linkbutton" onclick="disable()">Disable</a>
- <a href="#" class="easyui-linkbutton" onclick="enable()">Enable</a>
- </div>
- <input id="dd" class="easyui-datebox" required="true"></input>
- </body>
- </html>
加入/locale/easyui-lang-zh_CN.js:
- <script type="text/javascript" src="../locale/easyui-lang-zh_CN.js"></script>
选择日期。居然得到想要的格式。见图片:
ok, 问题解决。真是感叹这外国人的架构原来设计的这么好用,佩服!
URL:http://www.myexception.cn/open-source/407247.html
批改easyui datebox默认日期格式相关推荐
- EasyUI年-月日期格式的日期时间控件+行内编辑的年-月日期格式的日期时间控件
一.input标签下的easyui-datebox的年月时间格式 1.标签代码 <label style="font-size: 14px;font-family: Microsoft ...
- 修改oracle默认日期格式,更改Oracle的默认日期格式
Oracle的日期格式默认设置是DD-MON-YY,这种日期格式并不满足我们中国人的使用习惯. 为了改变这种显示格式,我们需要设置NLS_DATE_FORMAT来改变. 1.临时性的改变(PL/SQL ...
- 修改oracle默认日期,Oracle 修改默认日期格式
1.Oracle的日期格式 Oracle数据缺省的时间格式数据的显示形式,与所使用的字符集有关.一般显示年月日,而不显示时分秒. 例如,使用us7ascii字符集(或者是其他的英语字符集)时,缺省的时 ...
- oracle日期修改格式,Oracle 修改默认日期格式
1.Oracle的日期格式 Oracle数据缺省的时间格式数据的显示形式,与所使用的字符集有关.一般显示年月日,而不显示时分秒. 例如,使用us7ascii字符集(或者是其他的英语字符集)时,缺省的时 ...
- oracle 修改默认日期格式_查看MySQL查询计划的方法和格式
查看MySQL的查询计划是分析查询的重要方法,可以通过使用EXPLAIN语句来确认优化器将采取哪种查询计划,是否与你的预期一致. 如何使用EXPLIAN?使用它有两种方式: 直接在查询语句之前直接加上 ...
- sqlserver 默认日期格式转换为 yyyy-MM-dd
select CONVERT(VARCHAR(10),SampleTime,120) AS SampleTime from [dbo].[QUA_JBlampblack] 转换后的格式为 2016-0 ...
- 修改系统默认区域语言日期格式
最近一个EF+WCF的项目中需要使用Expression传递查询条件,有的条件中会包含对DateTime类型的参数进行判断. 例如最常见的 order=>order.OrderDate > ...
- java poi 设置时间空间_java - POI - 如何将单元格值设置为Date并应用默认的Excel日期格式?...
java - POI - 如何将单元格值设置为Date并应用默认的Excel日期格式? 我已经使用Apache POI一段时间以编程方式读取现有的Excel 2003文件. 现在我有了一个新的要求,即 ...
- 日期格式符RR和YY的区别
近来有一个应用,连接11g的库,自身逻辑大致是根据日期和其他条件删除表中对应的历史记录,此处日期条件判断未使用to_date(),其中日期和另外一些条件是个复合主键,然后再插入一条新记录(此处日期字段 ...
- iOS 日期格式转换
1.如何如何将一个字符串如" 20110826134106"装化为任意的日期时间格式,下面列举两种类型: NSString* string = @"20110826134 ...
最新文章
- nginx中的event模块
- 每日一九度之 题目1083:特殊乘法
- Python学习之路:内置函数
- c调用c++ qt_【C/C++】qt库结构及示例
- 声明定义存储过程或者函数时,其中的 delimiter 关键字是干嘛的呢?
- 再谈迭代器,生成器,yield,及和类的使用
- Android中RelativeLayout及TableLayout使用说明
- rabbitmq的基本安装、配置,以及整合springboot,gradle的hello.demo
- C# 中返回星期的函数
- Eclipse调试远程服务器
- 速轩三维 - 手持式激光三维扫描仪
- 基于ssm柴犬主题咖啡厅系统
- 超级详细的 Maven 教程(基础+高级)
- 为什么企业需要CRM系统?CRM的作用及其重要性分析
- 中文知识图谱CN-DBpedia构建的关键技术
- 头歌——c++单向链表
- 超详细版-计算网络地址、子网、广播地址、主机数
- Tomcat : 修改Tomcat端口号
- Could not find a version that satisfies the requirement pylab No matching distribution found for pyl
- 聚类k值确定--肘部法则
热门文章
- 视频教程-机器学习之集成学习(Ensemble Learning)视频教学-机器学习
- *.tbl格式数据导入oracle方法
- Node.js Puppeteer 爬虫简单学习笔记
- matlab中liccode函数,matlab 车牌识别 源码
- 天眼通内脏级分析C盘神器软件
- 机器人暑假班招生推文_2019暑期班招生方案【推荐】
- 函数式编程实验3/华科
- 加拿大电子计算机工程留学,加拿大留学申请ECE电子计算机工程专业解析
- git push和pull都报错unable to access https://gitee.com Could
- 切金条问题(贪心思想+哈夫曼树+小根堆使用)